javascript – Anchor Onclick Division亮点

我制作了一个有很多分工的简单网页.因此,为了直接导航到一个部门,我已将锚点放在这样的顶部:

<a href="#first">First</a><br/>
<a href="#second">Second</a><br/>
<a href="#third">Third</a>

为了平滑滚动,我使用了javascript:

$('a').click(function(){
    $('html, body').animate({
        scrollTop: $( $(this).attr('href') ).offset().top
    }, 500);
    return false;
});

现在我想为选定的部门添加效果.因此,当用户单击锚点时,页面会平滑地滚动到分区,并且所选分区将突出显示一秒钟.就像我们在Stack Overflow收件箱中获得任何新闻一样,我们点击它;页面节点和新闻项目会在短时间内突出显示.

我想在我的页面上做那件事.因为我有超过18个分区并且它们都是相同的.所以有必要区分所选择的分区.

以下是Fiddle:Fiddle For the Code的示例

任何帮助,将不胜感激.提前致谢.

解决方法:

在你的代码中,$(‘html,body’)返回2个元素,因此动画会触发两次.如果你包含jquery.ui你将能够这样做:

$('a').click(function(){
    var selector = $(this).attr('href');        
    $('html').animate({
        scrollTop: $(selector).offset().top
    }, 500,'',function(){
        $(selector).effect("highlight", {}, 1000);                             
    });
    return false;
});

JsFiddle

上一篇:通过javascript模拟单击锚标记


下一篇:为什么IE10在使用javascript href单击anchor元素时触发beforeunload事件以及如何防止它