1

ポートフォリオコンテンツをサイトに動的に表示したかったのですが、ページ全体（ヘッダー+コンテンツ+フッター）をajaxでリロードすると、正常に動作しますが、サイトはかなり長く、下部をロードした後に表示されます-どのように自動的にロード後にポートフォリオセクションにスクロールしますか？使用してみまし.scrollTo()たが、機能しません（間違った行に入力している可能性があります。コードを確認してください。

$(function(){
  $(".screen.fifth a[rel='tab']").click(function(e){
    //e.preventDefault();
    /*
    if uncomment the above line, html5 nonsupported browers won't change the url but will display the ajax content;
    if commented, html5 nonsupported browers will reload the page to the specified link.
    */

    //get the link location that was clicked
    pageurl = $(this).attr('href');

    //to get the ajax content and display in div with id 'content'
    $.ajax({url:pageurl+'?rel=tab',success: function(data){
      $('.screen.fifth .main_wrapper').html(data);
    }});

    //to change the browser URL to the given link location
    if(pageurl!=window.location){
      window.history.pushState({path:pageurl},'',pageurl);
    }
    //stop refreshing to the page given in
    return false;
  });
});

助けてください！

編集：

このページへのリンクを変更しました<a href=".../project_one.php#project_tag">。Chromeでは問題なく動作しますが、Firefoxでは前に説明したように動作します：/

4

2 に答える 2

1

この関数を使用します：

function goToByScroll(id){
    $('html,body').animate({scrollTop: $("#"+id).offset().top - 30},'slow');
}

入力されたIDまでスクロールするので、スクロールして呼び出したい場合は、次のように#portfolio_tag呼び出します。

goToByScroll('portfolio_tag');

AJAX呼び出しが完了したら。

于 2013-01-11T10:32:12.500 に答える
1

#projectsページがアンカーにジャンプし、ロード時にページのサイズが変更されているようです。

したがって、次のように入力すると、次のようになります。

goToByScroll( window.location.hash.substring(1) );

準備完了関数とサイズ変更関数の両方でページのサイズが変更されるコードの後に​​、($('.map').width(myWidth);)問題を解決する必要があります

于 2013-01-11T16:07:43.357 に答える