0

在我的主页上，我有一个带有 ID 的菜单，当我单击它时，它会滑动到相应的 div 并且它可以正常工作。

但是当我不在我的主页上并且我单击一个我希望能够转到主页然后滑动到该部分的项目时。

这是我现在使用的代码：

$('#mainMenu a').click(function(e){
    e.preventDefault();
    var div = $(this).attr('href');
    if('<?=get_site_url()?>/' == '<?=get_permalink()?>')
    {
        $('html, body').animate({scrollTop:$(div).position().top}, 'slow');
    }
    else
    {
        window.location.href = '<?=get_site_url()?>/'+div;
    }
});

这很好用，下一部分可以用，但我不能让它滑到 ID 上。

if (window.location.hash != "") {
    e.preventDefault();
    $('html, body').animate({scrollTop:$(window.location.hash).position().top}, 'slow');
}

有没有办法可以防止浏览器直接跳转到该部分而不是滑动到它？

4

2 回答 2

1

尝试在开始时滚动到右上角，然后向下滚动：

if (window.location.hash != "") {
    $('html, body').scrollTop(0).animate({scrollTop:$(window.location.hash).position().top}, 'slow');
}

此外，删除 e.preventDefault()，因为您没有定义任何名为e或event.

于 2013-04-12T02:04:42.647 回答
0

这就像一个魅力：

$('#mainMenu a').click(function(e){
    e.preventDefault();
    var div = $(this).attr('href');
    if('<?=get_site_url()?>/' == '<?=get_permalink()?>')
    {
        $('html, body').animate({scrollTop:$(div).position().top}, 'slow');
    }
    else
    {
        localStorage.setItem("hash", div);
        window.location.href = '<?=get_site_url()?>/';
    }
});

if (localStorage.getItem("hash")!=null) {
    $('html, body').animate({scrollTop:$(localStorage.getItem("hash")).position().top}, 'slow');
    localStorage.removeItem("hash");
}

我没有将哈希值放在我的 url 中，而是将其存储在 localStorage 中，并在我的页面头部检查它是否已设置。

在发布问题后几分钟就建立了这个解决方案，感谢那些帮助我的人:)

于 2013-04-12T02:12:45.070 回答