0

我有一个场景需要我检测周期性动画元素的动画停止并触发一个函数。我无法控制元素的动画。动画可以是动态的，所以我不能使用 smart setTimeout。

很长的故事

问题的简化形式是我正在使用第三方 jQuery滑动横幅插件，该插件使用一些混淆的 JavaScript 将横幅滑入和滑出。我需要找出slideComplete某种事件的钩子，但我所拥有的只是一个元素id。以这个jsfiddle为例，想象一下javascript被混淆了。当红框达到极限并停止时，我需要触发一个功能。

我知道:animated伪选择器，但我认为它需要我不断轮询所需的元素。我已经经历了这个，这个和这个，但无济于事。我已经检查了jquery 承诺，但我无法弄清楚在这种情况下使用它。这个 SO 问题最接近我的要求，但没有答案。

PS 一些可能有帮助的更多信息：

  1. 该元素不是由 JavaScript 创建的，它存在于页面加载中。
  2. 我可以控制何时在元素上应用插件（使其定期滑动横幅）
4

2 回答 2

1

我使用的大多数幻灯片插件都在动画结束时使用更改类...您可以扩展 jQuery 的“addClass”方法，以允许您捕获类更改，只要您使用的插件使用该方法，例如它应该：

(function($){

$.each(["addClass","removeClass"],function(i,methodname){
      var oldmethod = $.fn[methodname];
      $.fn[methodname] = function(){
            oldmethod.apply( this, arguments );
            this.trigger(methodname+"change");
            return this;
      }
   });
})(jQuery);

我在这里拼凑了一把小提琴

即使使用混淆代码，您也应该能够使用此方法来检查它们如何将参数发送给 animate（我通常在向 animate 发送参数时使用“选项”对象）并将它们的回调函数包装在触发的匿名函数中一个事件...... 就像这个小提琴

这是相关的脚本块：

(function($){
$.each(["animate"],function(i,methodname){
      var oldmethod = $.fn[methodname];
      $.fn[methodname] = function(){
          var args=arguments;
          that=this;
          var oldcall=args[2];
          args[2]=function(){
              oldcall();
              console.log("slideFinish");
          }
          oldmethod.apply( this, args );

          return this;
      }
    });
})(jQuery);
于 2013-05-08T22:20:20.563 回答
0

好吧，既然您没有说明正在制作哪种动画，我将假设它是水平/垂直平移，尽管我认为这也可以应用于其他效果。因为我不知道动画是如何完成的，所以setInterval评估将是我猜测如何做到这一点的唯一方法。

var prevPos = 0;
var isAnimating = setInterval(function(){
    if($(YOUROBJECT).css('top') == prevPos){
        //logic here
    }
    else{
        prevPos = $(YOUROBJECT).css('top');
    }
},500);

这将每 0.5 秒评估一次对象的垂直位置，如果当前垂直位置等于 0.5 秒前的垂直位置，它将假定动画已停止，您可以执行一些代码。

编辑 -

刚刚注意到你的 jsfiddle 有一个水平翻译，所以你的 jsfiddle 的代码在这里http://jsfiddle.net/wZbNA/3/

于 2013-05-08T22:17:57.340 回答