Question

我一直在寻找堆栈溢出，但似乎无法找到解决方案。基本上我正试图在多个页面上进行平滑的滚动效果。 EG平滑滚动效果在网站主页上 - 关于联系商店的主页是导航链接，例如，平滑滚动关于＆amp;联系人，位于主页上。当我在商店页面上点击约＆amp;联系链接，没有任何反应！

效果在主页上运作得很好，有没有办法可以调整以下代码，这样当用户在商店页面点击“关于”或“联系”时，它将返回“主页”页面，然后滚动到相应的链接？在此先感谢您的帮助。

var jump=function(e)
{
   if (e){
       e.preventDefault();
       var target = $(this).attr("href");
   }else{
       var target = location.hash;
   }

   $('html,body').animate(
   {
       scrollTop: $(target).offset().top
   },2000,function()
   {
       location.hash = target;
   });

}

$('html, body').hide();

$(document).ready(function()
{
    $('a[href^=#]').bind("click", jump);

    if (location.hash){
        setTimeout(function(){
            $('html, body').scrollTop(0).show();
            jump();
        }, 0);
    }else{
        $('html, body').show();
    }
});

Answer 1

我猜这样的事情可能有用：

//This is the function to scroll to your anchor
function scrollToElement(ele) {
    $(window).scrollTop(ele.offset().top).scrollLeft(ele.offset().left);
}

//This is to get the anchor
if(window.location.hash) {
    var elements = document.getElementsByTagName('a');
    for (var i = 0; i < elements.length; i++) {
        if(elements[i].href == window.location.hash){
            scrollToElement(window.location.hash);
        }
    }
}

你可能需要做一些我已经测试过的安排，但这是一般的想法。

多页网站上的平滑滚动

1 个答案: