【问题标题】:Stop jquery animation停止jquery动画
【发布时间】:2014-04-01 16:04:57
【问题描述】:

我在使用 jquery 动画时遇到问题。我的代码如下:

 if((valorscrollpx >= 800) && (valorscrollpx <= 1700))
  {
      $('#loquehacebien').fadeIn(600);
      $('#loquehacebien_estrella').animate({left: '-=500', top: '+=80'}, 1800);
  }
  else
  {
    $('#loquehacebien').fadeOut(600);
  }

问题是我不知道如何停止这个动画! 当滚动达到 800 像素时动画开始和结束,但每次我移动滚动动画都会从原来的位置重新开始。 我能做些什么?。我只需要动画单独开始和结束 1 次。

谢谢!

【问题讨论】:

    标签: jquery animation jquery-animate diagonal


    【解决方案1】:

    如果你只需要为星星设置一次动画,你可以使用这样的标志:

    var flag = false; 
    

    外面$(window).scroll(...);

    并将您的代码替换为

    if((valorscrollpx >= 800) && (valorscrollpx <= 1700) && !flag)   {
           $('#loquehacebien').fadeIn(600);       
           $('#loquehacebien_estrella').animate({left: '-=500', top: '+=80'}, 1800);
           flag = true;   
    }   else   {     
           $('#loquehacebien').fadeOut(600);   
    }
    

    【讨论】:

    • 非常感谢您的回答!我还是不明白该怎么办。请看这个链接:adminvps.com.ar/trabajos/test如果你前进滚动,星星会移动并且不会停止。我需要这个停止。我该怎么做?
    • 如果您只需要为星星设置一次动画,您可以使用这样的标志:var flag = false; if((valorscrollpx &gt;= 800) &amp;&amp; (valorscrollpx &lt;= 1700) &amp;&amp; !flag) { $('#loquehacebien').fadeIn(600); $('#loquehacebien_estrella').animate({left: '-=500', top: '+=80'}, 1800); flag = true; } else { $('#loquehacebien').fadeOut(600); } 如果您正在寻找它,我将用此评论替换我的答案
    • 只需将var flag = false; 放在$(window).scroll(...); 之外
    • 完美运行!,非常感谢!!!!最后一个问题:如果我需要当滚动通过 1700px $('#loquehacebien_estrella') 会振作起来(清除),我该怎么办?总结,当滚动在 800px 和 1700px 之间的位置时 $('#loquehacebien_estrella') 出现,否则消失。
    • 我不确定你的最后一个问题。但你可以试试: $('#loquehacebien_estrella').show();在你的第一个条件和 $('#loquehacebien_estrella').hide();在你的第二个。如果我的回答对你来说没问题,你能标记为绿色吗? ;)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-04-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多