我制作了一个简单的网页,其中包含很多部分。所以为了直接导航到一个部门,我在上面放了一个 anchor :
<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;
});
现在我想给选中的分区添加效果。因此,当用户单击 anchor 时,页面会平滑地滚动到该部门,并且所选部门会突出显示一秒钟。就像当我们在 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;
});
关于javascript - Anchor Onclick Division Highlight,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11936637/