当用户滚动到某个锚点时使用Javascript CSS

Question

我有一个网站http://www.mitchellfinlay.co.uk/newlake/magazines.html

它利用了一种窗帘效果，每个li元素都会在滚动时显示，或者在顶部点击链接时自动显示。。。tempus。。。通话业务等

我想做的是，当用户滚动到链接锚定的窗帘时，将链接的类别设置为"当前"。

这需要在用户滚动时或自动滚动在该页面上停止时发生。

这是可以实现的吗？

Answer 1

这应该迭代标题中的链接，从每个链接中删除类current，并将其添加到单击的链接中：

$(document).on('click', '#headerLinks a', function() {
    $("#headerlinks a").removeClass("current");
    $(this).addClass("current");
});

至于滚动，您可以使用element.posistion()和window.scrollTop()来计算屏幕顶部的元素。我用这把小提琴做了一个演示。你必须根据自己的需要进行调整，但它展示了基本概念。

Answer 2

关于评论的第二个问题：

您可以使用此变量剥离锚点，并检查遗留的内容。

示例：

$('#headerlinks a').click(function(){
   var anchor = document.location.hash;
   if ( anchor === '#myContent1' ) { //this can be href from ur a.
     $('.allContents').hide();
     $('#myContent1').show();
   }
});