2

我使用 jquery 的 scrollTop 函数在不同的锚点之间切换时让我的滚动平滑。首先，这是网址

问题

这是我的 jquery 脚本

“ziel”只是“目标”的德语单词，只是为了让您知道为什么这个变量被称为“ziel”

$(document).ready(function() {
    $('a[href*=#]').bind("click", function(event) {
        event.preventDefault();
        var ziel = $(this).attr("href");

        $('#portraitcontent').animate({
            scrollTop: $(ziel).offset().top
        }, 3000 , function (){location.hash = ziel;});
});
return false;
});

那么如何在动画结束时获得平滑的滚动而不会出现丑陋的跳跃呢？有任何想法吗？

我真的不知道该怎么办。和那个婊子一起度过几个小时！

感谢您的建议！

编辑

有了这个新代码：

$(document).ready(function() {
    $('a[href*=#]').bind("click", function(event) {
        event.preventDefault();
        var ziel = $(this).attr("href");
        $('#portrait-entry').animate({
            scrollTop: $(ziel).offset().top - 230
        }, 1500 , function (){

            if(window.history.replaceState){
                window.history.replaceState(null, document.title, ziel); // <--here
            }
        });
});
return false;
});

流畅的滚动工作没有难看的跳跃 但是现在我的锚链接不能按他们应该的方式工作。

请检查问题- 当您单击“fortbildungen”然后单击“mitgliedschaften”时，它不会向下滚动到锚点。我想我必须重置或某事。就像那样，因为我认为当您在#anchor 页面上时，链接无法正常工作。

我不喜欢 js/jquery。所以也许有人可以给我一个建议。我不知道如何谷歌这种问题。

感谢您的帮助和编辑的代码，这使我的滚动顺畅。

4

2 回答 2

0

只是因为您更改了动画回调中的 url 导致丑陋的跳跃。

支持 html5 的浏览器的解决方案是使用“window.history.replaceState”来更改 url 而不是直接更改 url。

代码如下：

$(document).ready(function() {
    $('a[href*=#]').bind("click", function(event) {
        event.preventDefault();
        var ziel = $(this).attr("href");

        $('#portraitcontent').animate({
            scrollTop: $(ziel).offset().top
        }, 2500 , function (){

            if(window.history.replaceState){
                window.history.replaceState(null, document.title, ziel); // <--here
            }
        });
});
return false;
});
于 2012-12-05T05:00:29.043 回答
0

最后我决定删除这个scrollTop代码并切换到jQuery.scrollTo插件和jQuery.localScroll。

只是让你知道

于 2012-12-05T23:56:04.157 回答