Question

我的jQuery有问题，我有一个有多个锚点的网站，我使用平滑滚动去锚点。问题是我在URL中有锚点。

这是我的代码：

/**
 * Checks if anchor exists. If it exists, scroll to it
 */
function scroll_if_anchor(href) {
    href = typeof(href) == "string" ? href : $(this).attr("href");

    // dynamically caluclates height
    var fromTop;
    var speed = 750; // Durée de l'animation (en ms)
    var headerHeight = $('#header').height(),
        navHeight = $('.nav-secondaire').height();

    if( headerHeight + navHeight > 200){
        fromTop = 300;
    } else {
        fromTop = 120;
    }

    // If our Href points to a valid, non-empty anchor, and is on the same page (e.g. #foo)
    // Legacy jQuery and IE7 may have issues: http://stackoverflow.com/q/1593174
    if(href.indexOf("#") == 0) {
        var $target = $(href);

        // Older browser without pushState might flicker here, as they momentarily
        // jump to the wrong position (IE < 10)
        if($target.length) {
            $('html, body').animate({ scrollTop: $target.offset().top - fromTop }, speed);
            if(history && "pushState" in history) {
                history.pushState({}, document.title, window.location.pathname + href);
                return false;
            }
        }
    }
}    

// When page loads, scroll to anchors
scroll_if_anchor(window.location.hash);

// Intercept all clicks on anchors
$("body").on("click", "a", scroll_if_anchor);

你知道吗？

非常感谢你！

Answer 1

您发布的代码可以平滑滚动页面上的链接，当您访问页面时滚动到特定的锚点将以下代码添加到您的javascript末尾。确保在加载整页时调用它。

var url = window.location.hash;
url = url.substring(url.indexOf('#'));
scroll_if_anchor(url)

Answer 2

location.hash可能不包含初始英镑符号，因此您必须确保它在传递给您的函数之前存在（希望英镑符号在那里）：

scroll_if_anchor(location.hash.replace(/^([^#])/, '#$1'));

删除URL中的锚点

2 个答案: