jQuery && Google Chrome

Posted by Happy on Stack Overflow See other posts from Stack Overflow or by Happy
Published on 2010-06-18T14:11:51Z Indexed on 2010/06/18 14:23 UTC
Read the original article Hit count: 184

Filed under:
|

This script works perfectly in all the browsers, except Google Chrome.

$(document).ready(function(){
    $(".banners-anim img").each(function(){
        var hover_width = $(this).width();
        var hover_height = $(this).height();
        var unhover_width = (hover_width - 30);
        $(this).width(unhover_width);
        var unhover_height = $(this).height();
        $(this).closest("li").height(unhover_height);
        var offset = "-" + ((hover_height - unhover_height)/2) + "px";
        $(this).closest("span").css({'position':'absolute', 'left':'0', 'top':'25px', 'width':'100%'});
        $(this).hover(function(){
            $(this).animate({width: hover_width, marginTop: offset}, "fast")
        },function(){
            $(this).animate({width: unhover_width, marginTop: 0}, "fast")
        });
    });
});

Chrome doesn't recognize changed image attributes.

When width of the img changes, height also changes. Even not in Chrome..

$(this).width(unhover_width);
var unhover_height = $(this).height();

unhover_height gives 0.

Full code of this script (html included) - unhover_height

Please help to fix this.

Thanks.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about google-chrome