简体   繁体   中英

jquery animate hide the scroll

i have a little issue animeting a div that is overflowed , the scroll blink during animation.

i made a fast example:

$(".div-animate").on("click", function(e){
    var toTop = 100,
        toHeight = $(this).outerWidth(true) + toTop;

    $(this).animate({
        top: toTop,
        height: toHeight
    });
});

live example

how can i prevent this little 'scroll blink' ?

jQuery adds an overflow:hidden rule when use animate function. There are two hacks you can do:

1) Modify the line of the jQuery source where overflow is setted to hidden (you can do this only if you import jquery from your site)

2) Force the property in your css doing something like this

.div-animate {
     overflow: auto !important;
}

Well this can be done this way too:

$(this).animate({
        top: toTop,
        height: toHeight
    }).css({"overflow":"auto"});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM