弹性滚动移动元素

时间:2013-08-18 18:18:45

标签: html css

我想知道当窗口弹性滚动时如何移动元素,例如,当我们滚动浏览网站画布时,此网站http://www.mccarthyarts.com/会将第一个背景向下移动。

任何人都知道这是如何运作的?

1 个答案:

答案 0 :(得分:0)

实现这一目标的方法包括收听滚动事件。每当触发事件时,检查您是否通过了文档的边界。如果你是,那么你必须在弹性区域。

$(function() {
    $(document).on("scroll", function() {
        var scrollAmount = $(this).scrollTop();
        var viewHeight = $(window).height();
        var docHeight = $(document).height();

        if (scrollAmount < 0) {
            // Top elastic
        }
        else if (scrollAmount + viewHeight > docHeight) {
            // Bottom elastic
        }
    });
});