I have an odd problem in FF10 using jQuery 1.7.1. I have a gallery that may have reduced the images, some of which can be scaled slightly from their original sizes.
It happens that sometimes the image will "scale" or move to one side when I try to animate its opacity using jQuery.
For example, look at one of the little ones here and hover over it: http://jsfiddle.net/ZUWkh/
It can be very subtle, but you can see the image change when the opacity is animated - it only affects images that have been reduced by a certain point, since I do not see this happening with a large image for this example.
Any ideas what is going on and how to overcome them?
I scale them like this, only to put them in lines in the gallery - the sizes are designed with PHP and are proportional. I could use CSS if there is a difference.
Update: The problem changes if you resize the browser window or zoom in / out - it cannot be solved, but the images that overlap change so that some of them are beautiful after that, and some that were beautiful now jump during the animation.
Another update: I also notice that this seems to affect anti-aliasing, since images that have disappeared seem to be “flabby,” but are smooth at full opacity. Something new in FF to make images more beautiful, maybe?
Another update: Just tested in Chrome, Safari on Mac, and IE7 on XP, this problem ONLY occurs on FF10 on Mac (I don’t know about other platforms or versions). Wierd ...
Another update: Just tested on XP with FF9, this problem does not occur. Then I upgraded it to FF10 and a problem arose. I think it can be strong enough to report an error ...