Question

我正在进行粘性导航，用户可以点击导航链接滚动到该特定部分。

jquery for script：

$('navbar-brand, .action-button, .navHeaderCollapse a[href^="#"]').on('click', function(event) {
    var target = $(this.href);
    if( target.length ) {
        event.preventDefault();
        $('html, body').animate({
        scrollTop: target.offset().top
        }, 2000);
    }
});

点击链接会将其带到该部分，但它是即时的，即没有任何延迟或不顺畅。

Answer 1

尝试以下代码，this.href将为您提供完整的网址。所以尝试获取属性而不是

$('navbar-brand, .action-button, .navHeaderCollapse a[href^="#"]').on('click', function (event) {
    var target = $($(this).attr("href")); <-- this line will do the trick
    if (target.length) {
        event.preventDefault();
        $('html, body').animate({
            scrollTop: target.offset().top
        }, 2000);
    }
});

Demo

Answer 2

请参阅http://jsfiddle.net/uehcpcg5/

您的输入错误

var target = $(this.href);

应该是

var target = $(this).href

无论如何都返回undefined。

将其更改为

$(this).prop("href");

返回完整的url，所以用＃拆分它以获取目标div的id，然后滚动到那个。看起来你的事件没有正确处理href。

平滑滚动到div不工作？

2 个答案: