Question

如果我使用jQuery Animate＆＃34; animate（）＆＃34;为HTML元素的宽度设置动画，我如何跟踪动态增加的宽度。例如，我有一个HTML元素＆＃39;＆＃39;将CSS设置为＆＃39; div {width：10％;}＆＃39;

<div></div> <!--css width set to 10%-->

我正在增加＆＃39;＆＃39;的宽度。用jquery

$('div').animate({width: '90%'});

当此代码执行时，同时元素的宽度超过60％＆＃39;我必须做其他事情，比如使用＆＃39; if statement＆＃39;。

在这种情况下，如何在设置元素宽度动画时跟踪宽度。我尝试使用＆＃39;：动画＆＃39;但是没有用？

我希望我能清楚自己想要什么。

Fiddle Link

Answer 1

<强> fiddle

$('button').click(function() {

    var at60triggered = false;

    $('div').animate({width: '90%'},{
        duration : 3000,
        step : function( widthPerc ) {
            if(at60triggered === false  &&  widthPerc >= 60) {
                at60triggered = true;
                // Do anything here
            }
            $('p').text( widthPerc ); // Keep track of percentage value
        }
    });

});

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

使用jQuery Animate时跟踪元素的宽度

1 个答案: