0

私はjQueryを学ぼうとしていますが、今は頭が真っ白です。次のコードは、スムーズな遷移でページを一番上までスクロールしますが、サイトのすべてのアンカー/ID リンクでこのスムーズな遷移が機能するようにしたいと思います (これは 1 ページャーのみです)。

$(document).ready(function() {

    $('a[href="#the-top"]').click(function (e) {
        $("html, body").animate({ scrollTop: $('#the-top').offset().top }, 1000);
        return false;
    });

});

これを実現するためにコードを変更するにはどうすればよいですか?

4

2 に答える 2

2 
jQuery(function($) {

    $('a[href^=#]').bind('click', function (evt) {
        var $what = $('#' + $(this).attr('href').split('#')[1]);
        $('html, body').stop().animate({ scrollTop: $what.offset().top }, 1000);
        evt.preventDefault();
    });

});

このコードで提案されている変更:

  • グローバル$オブジェクトをに変更jQuery
  • そのままjQuery(fn)_document.ready(fn)
  • クロージャー:その関数内でjQueryas asを使用$
  • 代わりにアンカーからデフォルトのイベントを防止しますreturn false(ソース: http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/ )
  • IEでの誤動作を防ぐために、アンカーhref$whatの一部を要求する使用（代わりになる場合があるため）#somethinghref="#some"href="http://yoursite.com/yourcurrentpage/#some

これらはすべてオプションのようなものです。あなたはアイデアを得る。お気軽に変更してください。

デモ AT: http://jsfiddle.net/Nm3cT/

于 2012-08-09T02:23:53.487 に答える