1
嗨,我需要动画元素取决于滚动。我的观点是设置元素的顶部位置1200像素,但是开始制作动画上1000像素,并完成它时,它通过1800px但它启动动画上1400px,完成谁知道滚动位置上的jquery动画
HTML
<div class="container">
<section id="first-section"></section>
<section id="second-section"></section>
</div>
CSS
#second-section {
position: relative;
top: 1200px;
left: 0;
height: 200px;
border: 2px solid blue;
width: 100%;
background-color: red;
opacity: 1;
}
JAVASCRIPT
$(window).scroll(function() {
var top = $(this).scrollTop();
if (top > 1000 && top < 1800) {
$("#second-section").stop().animate({
opacity: "1"
}, 'slow');
} else {
$("#second-section").stop().animate({
opacity: "0"
}, 'slow');
}
});
你有没有听说过[skrollr(http://prinzhorn.github.io/skrollr/)。您可以根据滚动位置轻松制作元素。 – Hareesh
不,我没有..但是,谢谢我要去尝试它:) – george