Bug Tracker

#1135 closed bug (wontfix)

Opened April 19, 2007 04:37PM UTC

Closed March 31, 2008 02:14AM UTC

Last modified March 15, 2012 06:15PM UTC

Doctype causing problems for animate() under IE7

Reported by: jspath Owned by: stefan
Priority: minor Milestone: 1.1.3
Component: interface Version: 1.1.2
Keywords: Cc:
Blocked by: Blocking:
Description

If you try the following HTML in IE7 and click the link to animate the text in the div to the color blue, the background color of the div seems to dissapear.

I did some testing and have determined that this problem only occurs when you include ''any'' doctype. Also, this problem does not occur in Firefox or IE6.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>

<style>
#foo {
 background-color:red;
}
</style>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="interface.js"></script>

</head>

<body>

<div id="foo">
  foo
</div>

<br /><br />

<a href="#" id="link">here</a>

<script>
$("#link").click(function(){
 $('#foo').animate({color: 'blue'}, 100);
 return false;
});
</script>

</body>
</html>
Attachments (0)
Change History (3)

Changed April 19, 2007 05:42PM UTC by jspath comment:1

I did some thorough debugging and was able to identify the exact statement which is causing the problem in ifx.js

y.overflow = oldOverflow;

I have yet to determine why this is causing the problem or what can be done about it.

Changed April 19, 2007 06:00PM UTC by jspath comment:2

If I comment out

y.overflow = 'hidden';

or

y.overflow = oldOverflow;

It seems to function as expected, although I would guess those statements are needed for other animation types.

Changed March 31, 2008 02:14AM UTC by scott.gonzal comment:3

description: If you try the following HTML in IE7 and click the link to animate the text in the div to the color blue, the background color of the div seems to dissapear.\ \ I did some testing and have determined that this problem only occurs when you include ''any'' doctype. Also, this problem does not occur in Firefox or IE6.\ \ {{{\ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"\ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\ <html>\ \ <head>\ \ <style>\ #foo {\ background-color:red;\ }\ </style>\ \ <script type="text/javascript" src="jquery.js"></script>\ <script type="text/javascript" src="interface.js"></script>\ \ </head>\ \ <body>\ \ <div id="foo">\ foo\ </div>\ \ <br /><br />\ \ <a href="#" id="link">here</a>\ \ <script>\ $("#link").click(function(){\ $('#foo').animate({color: 'blue'}, 100);\ return false;\ });\ </script>\ \ </body>\ </html>\ }}}\ → If you try the following HTML in IE7 and click the link to animate the text in the div to the color blue, the background color of the div seems to dissapear. \ \ I did some testing and have determined that this problem only occurs when you include ''any'' doctype. Also, this problem does not occur in Firefox or IE6. \ \ {{{ \ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" \ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> \ <html> \ \ <head> \ \ <style> \ #foo { \ background-color:red; \ } \ </style> \ \ <script type="text/javascript" src="jquery.js"></script> \ <script type="text/javascript" src="interface.js"></script> \ \ </head> \ \ <body> \ \ <div id="foo"> \ foo \ </div> \ \ <br /><br /> \ \ <a href="#" id="link">here</a> \ \ <script> \ $("#link").click(function(){ \ $('#foo').animate({color: 'blue'}, 100); \ return false; \ }); \ </script> \ \ </body> \ </html> \ }}} \
resolution: → wontfix
status: new → closed

Interface is no longer supported; consider switching to jQuery UI.