javascript - 如何在滚动上为 div 设置动画？

Question

您好，我可以更改和切换滚动条上的 div 属性，但是当我使用 animate 时，它​​不会工作，但方式很奇怪。

以下作品:

$(document).scroll(function() {
$("#register").css({left: $(this).scrollLeft() > 1348? "-140px":"0px"});
});

但这行不通:

$(document).scroll(function() {
$("#register").animate({left: $(this).scrollLeft() > 1348? "-140px":"0px"});
});

我希望滚动超过 1348 时 div 消失，如果滚动小于 1348，div 应该再次出现。

简单的 css 有效，但动画无效。

Answer 1

我会推荐使用 skrollr.js

https://github.com/Prinzhorn/skrollr

典型的用法很简单:

<div data-0="background-color:rgb(0,0,255);" data-500="background-color:rgb(255,0,0);">WOOOT</div>

其中 data-number 表示当前滚动位置。

动画可以使用 css transit 来完成。