0

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

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

我究竟做错了什么？让他们知道以上是否没有意义。

这是我的菜单栏锚点：

<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 栏。似乎在加载时将我的页面滚动到顶部。我怎样才能防止冲突？即仅在 iPhone 上运行此块，但也不与我的主题标签 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);
});
4

2 回答 2

2

我假设您的页面中已经加载了 jQuery 库，在这里您可以更改滚动间隔。它对我有用。

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;
        });

    }
});
于 2019-09-04T12:36:51.277 回答
0

我假设代码来自像 jQuery mobile 这样的库？无论哪种方式，您都可以将其修改为仅在没有来自 URL 的方向时才起作用：

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

然后它只会在没有提供哈希标签的情况下执行滚动。

于 2013-06-27T23:18:20.247 回答