3

すべてが正常に機能していますが、jQuery が配置されていても URL は変わりません。とにかくスムーズにスクロールして同時にURLを変更することはできますか? これの前に別の方法を試しましたが、これほどクロスブラウザ互換性がありませんでした。

私のHTMLは：

<li class="representing-you-online"><a href="#representing-you-online">Representing you online</a></li>
<li class="developing-your-people"><a href="#developing-your-people">Developing your people</a></li>

私のjQueryは次のとおりです。

$(document).ready(function() {
      $('a[href^="#"]').click(function() {
          var target = $(this.hash);
          if (target.length == 0) target = $('a[name="' + this.hash.substr(1) + '"]');
          if (target.length == 0) target = $('html');
          $('html, body').animate({ scrollTop: target.offset().top }, 500);
          return false;
      });
  });
$(document).ready(function(){      
        $('#logo a').click(function () {
            $('body,html').animate({
                scrollTop: 0
            }, 800);
            return false;
        });
});

ありがとう！

4

1 に答える 1

1

アンカーのクリック処理コードを次のように置き換えます。

$(document).ready(function() {
    $('a[href^="#"]').click(function() {
        var target = $(this.hash);
        var hash = this.hash;
        if (target.length == 0) target = $('a[name="' + this.hash.substr(1) + '"]');
        if (target.length == 0) target = $('html');
        $('html, body').animate({ scrollTop: target.offset().top }, 500, function (){
            location.hash = hash;
        });
        return false;
    });
});

jquery .animate() の最後にある完全な関数に注意してください。URLを変更します。

ここでデモを参照してください。

于 2013-06-03T02:54:39.337 に答える