Question

链接到jsfiddle - https://jsfiddle.net/dn5t2mwm/3/

$('a.item_link').click(function(){
    var hash = this.hash, top = $(hash).offset().top;
    console.log(hash, top);
    $('html, body').animate({
        scrollTop: top
    }, 500);
    return false;
});

我想做出流畅的滚动。但是当我考虑与锚点的链接坐标时，它会返回不同的结果。它看起来像是从视口开始的帐户坐标 - 而不是文档的开头。它适用于codepen，但不适用于local和jsfiddle。 css被禁用。也许你知道它有什么问题吗？

Answer 1

使用这段代码：

$('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;
        }
    }
});

为什么滚动不正确？

1 个答案: