javascript - 链接到另一个页面(通过 URL 标签)，然后滚动到元素

Question

所以我有一个主页菜单栏，其中有一个“功能” anchor 链接。我的功能部分实际上在同一页上。因此，当用户单击“功能”链接时，我有一个 jQuery 函数，可以将它们向下滚动到页面的该部分。这是应该的。

我的问题是，如果我在另一个使用相同菜单栏的单独页面(例如/联系我们)上，如果我单击“功能”，显然什么也不会发生。所以我写了这段代码。它查找 URL ` http://website.com/#features '，然后应该滚动到该 DIV - 它会短暂地执行此操作。问题是，一旦页面完全加载，页面就会返回到顶部。

我做错了什么？如果上述内容没有意义，请告诉他们。

这是我的菜单栏 anchor :

<a href="/#features">FEATURES</a></span>

这是我在主页上的 jQuery 片段:

home: function () {
    if (document.location.href.indexOf('#features') > 0) {
        $('html, body').animate({
            scrollTop: ($('section.feature-set').eq(1).offset().top - 60)
        }, {
            duration: 1000,
            easing: 'easeInOutExpo'
        });
        return false;
    }
}

*编辑*

所以这不是我的js代码，而是这段js。这会隐藏 iphone safari 栏。加载时似乎将我的页面滚动到顶部。我怎样才能避免冲突？ IE。仅在 iPhone 上运行此 block ，但也不与我的主题标签 URL 冲突

// Hides Safari Address Bar on iPhone
window.addEventListener("load",function() {
    // Set a timeout...
    setTimeout(function(){
        // Hide the address bar!
        window.scrollTo(0, 1);
    }, 0);
});

Answer 1

I assume there is already jQuery library is loaded in your page, here you can change interval of scroll. It is working for me.

jQuery(window).ready(function(e){

    // Remove the # from the hash
    var loadTarget = location.hash.replace('#','');

    if(loadTarget != ''){

        var $loadTarget = jQuery('#' + loadTarget);
        jQuery('html, body').stop().animate({
                'scrollTop': $loadTarget.offset().top
            }, 1000, 'swing', function() {

            window.location.hash = '#' + loadTarget;
        });

    }
});