我有一个单页网站。
我使用JavaScript添加了平滑滚动。
$(document).ready(function(){
$("li > a").on('click', function(e) {
if (this.hash !== "") {
e.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
}
});
});
这是我的导航HTML代码:
<li class="{{ slug == '/' ? 'active' : '' }}"><a href="#home">HOME</a></li>
<li class="{{ slug == '/about' ? 'active' : '' }}"><a href="#about">ABOUT</a></li>
<li class="{{ slug == '/blog' ? 'active' : '' }}"><a href="#blog">BLOG</a></li>
但是当我转到另一页(比如博客)时,当我再次点击导航回到单页时,出现了错误顶部。 我错过了什么吗?
animate
函数中使用断点或警报检查$(hash).offset()
的值,如果它是undefined
,那么你就知道错误的原因了。 - Pranav Singh