从窗口顶部跟踪固定div的滚动偏移量

有了这个导航栏，我想跟踪它的.offset().top，所以我可以根据窗口顶部的偏移来添加或删除类。

例（这是我的逻辑，但我不能让jQuery的警报甚至工作。

$(window).scroll(function() { 
    var elem = $('.navigation'); 
    var topValue = offset.top; 
    if (topValue > 400) { 
    alert(topValue); 
    } 
});

来源

2012-06-14 Matthew Harwood

尝试jQuery Waypoints，而是指定偏移的，你使用的元素在页面上当他们进入视野时触发回拨：

$(function() { 
    $("#map").waypoint(function() { 
    alert("Scrolled to #map"); 
    }); 
});

编辑：

但要正确回答您的问题，您的导航将始终处于相同的位置，因为position: fixed将您的元素相对于视口而不是页面。如果你想做到这一点没有路标，只是检查body标签的scrollTop：

$(function() { 
    $(window).scroll(function() { 
    var offset = $("body").scrollTop(); 
    if (offset > 400) 
     alert("Scrolled to 400"); 
    }); 
});

来源

2012-06-14 23:29:35

大声笑很容易。谢谢！ –

与您的代码的问题是，你正在使用offset.top，但你有没有声明offset变量，这意味着.top没有返回任何东西。

看来你已经看过offset()的jQuery文档，但没有正确理解/阅读示例。

在文档，它们被初始化的变量：

var offset = $(this).offset();

然后提取.top和.left值：

alert(" coordinates: (" + offset.left + ", " + offset.top + ") ");

看从你的链接的网页，你不需要一个非常广泛的脚本来检查用户滚动了多少。这个小功能给你你需要的东西：

看到这个working Fiddle例子！

// getPageScroll() by quirksmode.com 
function getPageScroll() { 
    var xScroll, yScroll; 
    if (self.pageYOffset) { 
     yScroll = self.pageYOffset; 
     xScroll = self.pageXOffset; 
    } else if (document.documentElement && document.documentElement.scrollTop) { 
     yScroll = document.documentElement.scrollTop; 
     xScroll = document.documentElement.scrollLeft; 
    } else if (document.body) {// all other Explorers 
     yScroll = document.body.scrollTop; 
     xScroll = document.body.scrollLeft; 
    } 
    return new Array(xScroll,yScroll) 
}

关于这方面的更多信息可以在this stackoverflow answer找到。

来源

2012-06-15 00:30:00 Zuul

从窗口顶部跟踪固定div的滚动偏移量

回答

相关问题