3

サイトに無限スクロールで新しいページが読み込まれました。新しいページが読み込まれるたびに、HTML5 プッシュステート API を使用して URL を更新します。

if(history.pushState) {
    history.pushState(null, null, '/page:' + current_page);
}

私のURLは次のようになります：

http://mysite.com.com/page:1
http://mysite.com.com/page:2
http://mysite.com.com/page:3

等々...

ユーザーがリスト内の項目 (たとえば 2 ページ目) をクリックしてから [戻る] ボタンをクリックすると、次のページに戻ります。

http://mysite.com.com/page:2

しかし、ページの上部ではなく、クリックした部分にいます。page:2 が一番上に読み込まれるようになったため、彼がいる部分は新しいページ 3 を読み込み、代わりにそのページの投稿を見ています。

戻るボタンがクリックされるたびにユーザーがページのトップに戻るようにする方法はありますか?

ページの読み込み時にアンカー タグと JavaScript スクロールを使用してみましたが、ユーザーがトップに移動する前にいくつかのジャンプがあるため、どちらも実行できません。

私が見た無限スクロールで動作するバックボタンの最良の例はhttp://imgur.comですが、どうやってそれを行うのかわかりません。

4

1 に答える 1

3

あなたが探していることをするように見えるgithubにinfinite-ajax-scrollと呼ばれるライブラリがあります。オプションを使用して初期化できhistoryます。これにより、ページをスクロールすると URL のハッシュが更新されます。唯一の問題は、ライブラリを操作するためにデータをロードする方法を変更する必要があることです。 

jQuery.ias({
    ....
    history:true,
    ....
});

tumbledry.org のこのブログ投稿をチェックすることもできます。これは、あなたがやろうとしていることにより近いことを説明していますが、同様に実装されているとは思いません。

于 2013-04-29T19:12:38.153 に答える