jQuery的动画隐藏滚动

Question

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' ?

Answer 1

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;
}

Answer 2

Well this can be done this way too:

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