Question

假设我有一个名为index.html的网页。在文档中，我有一个链接到另一个页面中的锚点。所以我们说：

<a href="page.html#anchor" class="scroll">Link</a>

现在我有以下jQuery脚本用动画滚动到同一文档中的一个锚点：

$(".scroll").click(function(event){     
    event.preventDefault();
    $('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
});

但是，如果锚点位于同一页面，则此方法有效。我怎样才能让它工作到另一个页面呢？当我点击链接时，我希望它转到另一页并滚动到锚点。

Answer 1

你需要让你的锚点像

<a href="2nd.html#anchor_temp">Go</a>

因为您无法阻止浏览器的默认滚动行为

当文档准备就绪时，您需要从URL中查看哈希标记值然后删除_temp然后设置动画

$(document).ready(function(e){  
    var str= location.hash; 
    var n=str.replace("_temp","");
    $('html,body').animate({scrollTop:$(n).offset().top}, 500);
});

我希望这会有所帮助:)

即使链接重定向到另一个页面，jQuery滚动动画也可以锚定

1 个答案: