1

レイアウトでこのようなものを使用しています

<nav id="main-nav">
   <a href="#link1">Link1</a>
   <a href="#link2">Link2</a>
   <a href="#link3">Link3</a>
</nav>
<div id="link1">
   some content goes here
</div>
<div id="link2">
   some content goes here
</div>
<div id="link3">
   some content goes here
</div>

したがって、ナビゲーションリンクをクリックすると、正しいdivまでスクロールダウンします。NAVは固定位置のメニューであり、上から200pxを使用します。スクロールに使用するJSは次のとおりです。

$('#main-nav a').click( function(event) {
    var nome = $(this).attr("href");
    $('html, body').animate({
         scrollTop: $(nome).offset().top-198
     }, 1600);
});

さて、この内部ページがあり、ナビゲーションリンクは次のようになります。

<a href="http://www.mysite.com/#link1">Link1</a>

問題は、ホームを正常にロードすることですが、divはNAVの下の上部から始まります(ページをロードするときにないため)。必要なのは、ロードするURLからoffset().top-198を取得する方法を見つけることだと思います。#link作る、onLoad scrollTopそうですか?

何か助けてください?

4

2 に答える 2

1

以下のようなものを使用できます。これは、URLで現在のハッシュタグを検索し、それをdivs IDと照合して、そのIDをアニメーション化します。

$(function(){
   currentPage = window.location.hash;
   moveLink =  $('div').find($(this).attr('id',currentPage));
   $('html, body').animate({
      scrollTop: $(moveLink).offset().top-198;
   });
});

編集 - - - - - - - - - - - - - - - - - - - -

var aniFunc = function(a){
   $('html, body').animate({
       scrollTop: $(a).offset().top-198;
   });
};

$(document).ready(function(){
   currentPage = window.location.hash;
   moveLink =  $('div').find($(this).attr('id',currentPage));
   aniFunc(moveLink);
}

$('#main-nav a').click( function(event) {
    nome = $(this).attr("href");
    aniFunc(nome);
});
于 2013-02-23T23:54:01.870 に答える
0

あなたは最初にそのようなことをすることができます:

window.location.href.match('(#.*$)')

ページの読み込み時にその要素のクリックをトリガーします。

于 2013-02-23T23:52:54.130 に答える