0

jQuery スムーズ スクロール スクリプトがあります。

$(".scroll").click(function(event){
     event.preventDefault();
     var dest=0;
     if($(this.hash).offset().top > $(document).height()-$(window).height()){
          dest=$(document).height()-$(window).height();
     }else{
          dest=$(this.hash).offset().top;
     }
     $('html,body').animate({scrollTop:dest}, 500,'swing');
 });

それはうまくスクロールします

<a id="info"></a>

しかし、私の他の人には機能しません

<a id="top"></a>
<a id="bottom"></a>
<a id="announcements"></a>
etc ...

手動で domain.com/#top を追加すると機能するため、アンカーは問題ないはずです。

誰かが理由を知っていますか？

ライブ プレビュー: http://thehtmlworkshop.com/

4

3 に答える 3

1

ボタンの上下にはクラスがありませんscroll。追加してみてください。

<a href="top" class="scroll" /><!-- img --></a>

そして、確実に、aイベントが発生することを確認します。

$("a.scroll").click(function(event){
    //your code there
});
于 2013-03-27T10:14:49.833 に答える
1

問題は、クリックを「スクロール」のクラスに設定していることです。クリック イベントを親に設定する必要があります。

$(".scroll").parent().click(function(event){
     event.preventDefault();
     var dest=0;
     if($(this.hash).offset().top > $(document).height()-$(window).height()){
          dest=$(document).height()-$(window).height();
     }else{
          dest=$(this.hash).offset().top;
     }
     $('html,body').animate({scrollTop:dest}, 500,'swing');
});
于 2013-03-27T10:16:35.027 に答える
0

ここにjsfiddleがあります：これは機能します。

JQuery:

$(".scroll").click(function(event){

var target = $(this).hash;
 var dest=null;
 if(($(this.hash).offset().top) > ($(document).height()-$(window).height())){
      dest= $(document).height()-$(window).height();
 }else{
      dest=$(this.hash).offset().top;
 }

$('html,body').animate({scrollTop:dest}, 1000, 'swing');
 event.preventDefault();

});

于 2013-03-27T10:28:33.917 に答える