jQuery：#IDがURLの最後にある場合、ページはブラウザ画面の上部に要素が表示され、#ID要素にスクロールすることはできますか？

StackOverflow https://stackoverflow.com/questions/4860055

  •  27-10-2019
  •  | 
  •  

質問

質問の最後にリンクしたページにアクセスして、メインのStackOverFlowページに送信しますが、ブラウザはページの上部を表示しないので、 #h-recent-badges 要素とその要素の位置でページの表示を開始します。

記事の下部にあるコメントの1つへのリンクで誰かが私のサイトに来ると、ページの上部で人を開始してから#idまでスクロールすることができますか？ 、#idに登場する代わりに？

ページ上のアンカーリンクがクリックされたときにページを#IDにスクロールすることができますが、誰かがGoogleからリンクを要素#IDにリンクして来たときに話しています。

https://stackoverflow.com/#h-recent-badges

役に立ちましたか？

解決

jQueryクエリ文字列プラグインをご覧ください。http://plugins.jquery.com/project/query-object

最新バージョンには、ハッシュパラメーターの解析があります。

あなたがしたいのは、ページが読み込まれたらハッシュパラメーターをつかみ、$ .scrollto（$（ "＃" + hashvalue）のようなことをすることです。

チェックアウト http://flesler.blogspot.com/2007/10/jqueryscrollto.html Scrolltoチュートリアル用。

他のヒント

私はここで間違っているかもしれませんが、このブラウザの動作はウェブサイトがロードされている速度に依存していると思います...

たとえば、接続が遅い場合、コメントが利用可能になるポイントまでロードするのに時間がかかります - そして、それは彼らに移動することができます（彼らが実際にページで実際にアッパーをする前ではありません）

JQuery'sを使用して使用することもできます スクロールプラグイン ページが読み込まれたときにページを手動でスクロールしようとします（おそらくPreventDefaultを使用しますか？）

$(document).ready(function() { 
    if(document.URL.indexOf('#') > 0){
       var link = document.URL.split('#');
       scrollId('#'+link[1])
    }
});
$(window).on('hashchange', function(e){
   if(document.URL.indexOf('#') > 0){
       var link = document.URL.split('#');
       scrollId('#'+link[1])
    }
});

function scrollId(id)
{     
    setTimeout(function(){
        $('html, body').animate({scrollTop: $(id).offset().top - 0 }, 'slow');  
    },500);
}
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top