Question

所以，我的页面锚点使用jquery脚本将页面滑动到各个锚点，但问题是当你回到顶部去一个不同的锚页面故障时我似乎无法解决它。

我觉得问题与html试图在jquery有时间行动之前直接进入页面锚点有关，或者它是一个非常明显的错误，我应该停止编码。

问题的链接：http://beta.morriscommunications.com.au/（此处发布的代码太多了。）

如果任何潜在的解决方案可以在其自身的代码中实现，我更愿意。

干杯。

编辑：此网站最好在谷歌浏览器中查看，因为这是我主要为其开发的。

Answer 1

$(".abo").click(function() {
   event.preventDefault(); <---- this will help you
   scrollToAnchor('abo');
});

此外，我注意到您正在使用课程进行导航，并且您有多个同名的ID，这很糟糕。

我建议您使用一个功能进行导航。使用＆＃34;这个＆＃34;并获得单击的元素class / id / data属性，并使用它导航到锚点，这将为您节省代码。

Answer 2

这是关于您的解决方案的简短codepen，这是正确的。在加载任何库之前，始终优先加载jquery。链接标记的异步功能可以帮助您。

此代码对我来说也适用于所有网站，

$('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
        || location.hostname == this.hostname) {

        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
           if (target.length) {
             $('html,body').animate({
                 scrollTop: target.offset().top
            }, 1000);
            return false;
        }
    }
});

在查看代码时，我发现html5标签非常少，使用它们，现在每个浏览器都很友好。

动态页面锚点滑块毛刺

2 个答案: