我有一个包含不同部分的页面，可以通过单击导航栏中的相应链接来滚动到该页面或访问这些页面。该页面的演示位于codepen http://codepen.io/meek/pen/NNprYb?editors=1010
我正在使用以下代码来跟踪用户正在滚动的部分并在导航栏中突出显示该部分
$(window).on("scroll", function() {
var currentPos = $(window).scrollTop();
$('.nav li a').each(function() {
var sectionLink = $(this);
var section = $(sectionLink.attr('href'));
if(section.position().top <= currentPos && section.position().top + section.height() > currentPos) {
$('.nav li').removeClass('active');
sectionLink.parent().addClass('active');
}
else {
sectionLink.parent().removeClass('active');
}
});
});
它可以正常工作，但是在主页和关于各部分之间滚动时有一个间隙，没有任何链接被突出显示。我觉得这可能是由于导航栏在家庭之间占据的空间所致，但是我不确定如何克服这个问题。理想情况下，我希望该间隙也突出显示“大约”。
我试图将其添加到上面的代码中：
else if($('#nav-wrapper').position().top <= currentPos && $('#nav-wrapper').position().top + $('#nav-wrapper').height() > currentPos) {
$('.nav li').removeClass('active');
$('#temp').addClass('active');
}
但这是行不通的。感谢帮助
解决方案：调整事件中的if语句scroll以符合以下条件。
if(section.position().top <= currentPos && sectionLink.offset().top + section.height() > currentPos)
该键的存在，二审section.position().top修改sectionLink.offset().top
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句