2

jquery の scrollTop 関数を使用して、異なるアンカーを切り替えながらスクロールをスムーズにします。まずはURLはこちら

問題

これは私の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」をクリックすると、アンカーまでスクロールダウンしません。リセットまたはs.thを行う必要があると思います。そのように、あなたが #anchor ページにいるとき、リンクがうまく機能しないと思うからです。

私はjs/jqueryには興味がありません。誰かが私にアドバイスをくれるかもしれません。この種の問題をググる方法がわかりません。

あなたの助けと編集されたコードに感謝します。これにより、スクロールがスムーズになりました。

4

2 に答える 2

0

最後に、この scrollTop コードを削除し、jQuery.localScroll と組み合わせて jQuery.scrollTo プラグインに切り替えることにしました。

お知らせするだけ

于 2012-12-05T23:56:04.157 に答える
0

animate コールバックで URL を変更しただけで、醜いジャンプが発生します。

html5 対応ブラウザの解決策は、URL を直接変更する代わりに、「window.history.replaceState」を使用して 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 に答える