Question

我的网页上有很多部分。我想给他们添加一个班级名称＆＃34; active＆＃34;如果window.top等于任何section.top，我在页面中滚动。我的意思是我想要知道我是在这个部分。我能这样做吗？所有部分都有自己的data-id属性。我尝试了类似下面的内容，但它没有任何意义;

$(window).scroll(function () {
    if ($(this).top == $("section").offset().top) {
        $("section").addClass("active");
    }
});

Answer 1

尝试此功能：

$.fn.isOnScreen = function(){

var win = $(window);

var viewport = {
    top : win.scrollTop(),
    left : win.scrollLeft()
};
viewport.right = viewport.left + win.width();
viewport.bottom = viewport.top + win.height();

var bounds = this.offset();
bounds.right = bounds.left + this.outerWidth();
bounds.bottom = bounds.top + this.outerHeight();

return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));

};

使用它：

$(window).scroll(function () {
    if ($(this).isOnScreen()) {
        $("section").addClass("active");
    }
});

祝你好运！

参考：http://upshots.org/javascript/jquery-test-if-element-is-in-viewport-visible-on-screen

如何检测窗口顶部等于窗口滚动顶部的任何部分

1 个答案: