jQuery – 动画时调用函数

是否可以在.animate事件中调用某些函数？ 我必须为某些div上的每个resize事件调用resize()函数。

举个例子，我在window resize事件上调用函数：

 $(window).resize(resize); 

但现在我希望在animate事件中调用此函数（每个更改的像素（如.resize ））。

 selector['el']['box'].animate({width:selector['el']['box'].width() - 250}, 500); selector['el']['box'].promise().done(function() {resize();}); 

但这不是我想要的，因为我希望一直调用resize函数，不仅仅是在最后……

Answer 1

你可以使用它的步进function，如：

 selector['el']['box'].animate({width:selector['el']['box'].width() - 250}, 500, step: function( currentStep ){ //step animation complete //do something here }); 

见:: step in animate（）

Answer 2

step函数是你的解决方案这里是jquery文档说的

步

类型：Function（Number now，Tween tween）为每个动画元素的每个动画属性调用的函数。 此函数提供了修改Tween对象以在设置之前更改属性值的机会。

看到这个演示，你会看到宽度属性逐步改变

 $( "div").css({ position: "fixed", left: "50px" }) .animate( { width: 1000 }, { duration: 500, step: function( currentLeft, animProperties ){ $( "span" ).html( $( "span" ).html()+"
value:"+currentLeft+" state:"+animProperties); console.log( "Left: ", currentLeft ); } }); 

Answer 3

  selector['el']['box'].animate({ // for example opacity: 0.25, left: '+=50', height: 'toggle' }, { duration: 500, step: function() { //add your code here }); 

将代码添加到第二个function块。