internet explorer - jQuery: animating backgroundPosition behaves oddly in IE < 9 -


try hovering on "cancel" button in internet explorer 8:

http://jsfiddle.net/hydka/

you'll notice first time hover on it, jumps , can see "ok" button, corrects itself. subsequent hovers function normally, though.

please note bug occurs "ok" button; it's more obvious "cancel" button. also, bug present in ie 6 , 7, demo i've provided won't work since image base64 encoded.

the code works fine in non-ie browsers, of course.

is jquery bug? there can work around besides splitting images up? include stylesheet ie < 9, i'd rather not if don't have to.

thanks!

old internet explorer versions wont accept css values without 'px'. example= width:10px;

so need add + 'px' @ end of animate values.

here working jsfiddle

 $(this).find('.sliding_link_image').animate({ 'backgroundposition': (sliding_link_original_background_position + 10) + 'px'//<--here }, 150); }, function() { $(this).find('.sliding_link_image').animate({ 'backgroundposition': sliding_link_original_background_position + 'px'//<--and here }, 150); 

Comments

Popular posts from this blog

javascript - backbone.js Collection.add() doesn't `construct` (`initialize`) an object -

php - Get uncommon values from two or more arrays -

Adding duplicate array rows in Php -