Question

我有这个代码

.test2{
transition: 10s;  
}

js

window.onscroll = function() {
  $( ".test2" ).animate({
  top: -s-100 }, 0, "linear");  
  }

或

window.onscroll = function() {
  $('.test2').css('transition',  0);  
  $('.test2').css('transition',  "");  
  }

但是什么也没发生。应该是在以下情况下，我用滚轮向下滚动页面或在滚动条上单击鼠标：0s;但是当我停止这样做的那一刻。然后过渡立即变为10s 当您单击按钮时，动画应该是平滑的。

有可能做这样的事情吗？

Codepen示例

Answer 1

只是一些代码，还没有对其进行测试，但是我希望它与您要查找的内容接近，每当您滚动页面时都使用offset()来检索顶部位置。

并设置xtop变量，然后在每次页面滚动时调用doAnimation()，但请记住在每个对象上调用stop()方法，因此动画缓存不会提示并降低系统速度。

var xtop;

window.onScroll = function(){
    xtop = $(window).offset().top; //get the top position.
    doAnimation();
}

function doAnimation(){
   $(".test2").stop().animate({top: xtop}, 10000, "linear");  
}

无论何时停止滚动，对象都会在10秒（10000毫秒）内动画到xtop位置，我希望它可以工作。

如何使用jQuery更改动画速度？

1 个答案: