I am having some strange behavior with the fadeOut function. I asked about it on StackOverflow. If you want, you can see the discussion at http://stackoverflow.com/questions/735292/strange-behavior-when-using-jquery-fadeout-function-on-element-with-floated-eleme . Someone on there mentioned that this is a bug with jQuery 1.3.2 and it is not present in 1.3.
I have pasted the question below in case anyone is unable to view the discussion: I am trying to use jQuery to fade out a div, using the fadeOut function. In most cases, it seems to work fine, but in certain cases, not all of the content fades out. If I have an absolutely positioned element and a floated element within the div, the fadeOut function doesn't work. If I only have an absolutely positioned element, it doesn't work. But if I have an absolutely positioned element and an unstyled element, it works. This may sound hard to explain, but you can try it yourself using this test code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head> <title>jQuery fadeOut test</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> </head> <body> <div id="testBox1" style="position: relative"> <div>test</div> <p style="position: absolute; left: 0; top: 0">This text should fade out.</p> </div> <br><br> <button type="button" onclick="$('#testBox1').fadeOut()">fade out</ button> <!-- works --> <hr> <div id="testBox2" style="position: relative"> <div style="float: left">test</div> <p style="position: absolute; left: 0; top: 0">This text should fade out.</p> </div> <br><br> <button type="button" onclick="$('#testBox2').fadeOut()">fade out</ button> <!-- doesn't work --> <hr> <div id="testBox3" style="position: relative"> <p style="position: absolute; left: 0; top: 0">This text should fade out.</p> </div> <br><br> <button type="button" onclick="$('#testBox3').fadeOut()">fade out</ button> <!-- doesn't work --> </body></html> Everything seems to work fine in IE7, but in Firefox and Chrome, I am getting the strange behavior. Can anyone figure out why? Am I doing something wrong, or is it a browser bug or a bug within jQuery? You can see an example you can easily tinker with at http://jsbin.com/obipe . Add /edit at the end of the URL to be able to edit it.