jQuery触发div高度更改事件（动画？）

Question

I need to detect the total height of my div "collectionFilterPage" while the animate event is running. Is there any event to bind? This is my ja code:

function showMoreItems() {
    $("#collectionFilterPage").animate({
        height: "+=720"
    }, 1000, function() {
        if ($("#collectionFilterPage").outerHeight() >= $(".lista").outerHeight())
            unbindScrollEvent();
    });
}

Basically I would want to fire the "unbindScrollEvent" when both div "collectionFilterPage" and "lista" have the same height. thanks

Answer 1

You might want to switch to this $().aninate signature and use the step property which allows you to set a callback function that is called during each step of the animation.

function showMoreItems() {
    function checkHeight() {
        if ($("#collectionFilterPage").outerHeight() >= $(".lista").outerHeight())
            unbindScrollEvent();
    }

    $("#collectionFilterPage").animate({
        height: "+=720"
    }, {
        duration: 1000,
        complete: checkHeight,
        step: checkHeight
    });
}

http://api.jquery.com/animate/

$(...).animate( properties, options );

Answer 2

Solved. It has been very easy

height: $("#collectionFilterPage").outerHeight() >= $(".lista").outerHeight() ? "+=0" : "+=720"