Question

我正在使用这个小代码，它对我的标题img工作正常。但是稍后在我的页面上我想再次使用相同的效果。除了从我开始滚动的第一刻开始调用动作。所以当我在相关的div或者在一定数量的像素之后，我希望动作发生。我需要添加什么？

提前致谢！

<script>
    $(window).scroll(function() {
    var s = $(window).scrollTop(),
    opacityVal = (s / 150.0);
    $('.blur_img').css('opacity', opacityVal);
});
</script>

Answer 1

您必须在代码中添加支票：

.scrolltop（）返回用户垂直滚动的数量。

<script>
$(window).scroll(function() {
    var s = $(window).scrollTop();

    if (s > 200) {
        opacityVal = (s / 150.0);
        $('.blur_img').css('opacity', opacityVal);
    }
});
</script>

Answer 2

我发现viewport.js对于检测滚动非常有用。

Viewport为jQuery添加了一些额外的选择器。使用这些选择器，您可以检查元素是否在视口内部或外部。

因此，当您页面中的元素进入＆＃34;视口＆＃34;您可以调用您的函数来加载更多内容，或者您需要执行的任何其他操作。

如何在一定量的滚动后触发事件？

2 个答案: