我环顾四周,但我找到的所有答案都只有在用户位于页面顶部时才有效——否则,它会将用户带到错误的位置,因为它没有考虑到如何用户向下滚动了很多页面。这是我现在正在尝试的('.sidebar a' 是指向侧边栏中 anchor 标记的链接,'.site-wrap' 是可滚动的 div):
$('.sidebar a').click(function() {
var $url = $(this).attr('href');
var $offset = $($url).offset(); //Getting the position of the anchor
var $currPos = $('.site-wrap').scrollTop(); //Getting the current scrolled position
$('.site-wrap').animate({
scrollTop: $offset.top - $currPos
}, 1000);
return false;
});
我似乎无法弄清楚为什么它不起作用。我是新手,所以这可能是微不足道的事情,但我很感激任何指向正确方向的指示。
最佳答案
如果我没记错的话,您只想滚动元素的位置,而不考虑当前滚动位置。
因此,将当前滚动位置从等式中取出并使用 jQuery 的 .position 函数而不是 .offset 就足够了:
$('.sidebar a').click(function() {
var $url = $(this).attr('href');
var $offset = $($url).position(); //Getting the position of the anchor
$('.site-wrap').animate({
scrollTop: $offset.top
}, 1000);
return false;
});
如果当前元素是 .site-wrap 的直接子元素,则此方法有效。
关于javascript - 当用户已经向下滚动页面时,如何导航到 anchor 标记?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37084116/