Question

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

它利用幕布效果，每个li元素在滚动时显示或在顶部点击链接时自动显示... tempus ... talkbusiness等。

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

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

这可以实现吗？

Answer 1

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

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

对于滚动，您可以使用element.posistion()和window.scrollTop()来确定屏幕顶部的元素。我在这个fiddle做了一个演示。你必须根据自己的需要进行调整，但它显示了基本概念。

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();
   }
});

用户滚动到锚点时的Javascript CSS

2 个答案: