2010-11-25 54 views
2

こんにちは リロード時にページを以前の位置にスクロールする簡単な方法があるかどうかを知りたかったのです。 たとえば、掲示板が私のページの途中にあります。その掲示板にページが表示され、ユーザーは次の掲示板を見るために次をクリックすることができます。ページがリロードされるときの問題は、ページの上部にジャンプする通常の動作です。 同じ位置にページを再ロードする良い例は、F5を使用してページをリロードするときです。同じ位置にリロードするページ

私はそれを行うのが難しい方法を知っています。

ページのロードがURLからページスクロールを引き出し、それをアクセスすることが可能である

document.body.ScrollTop==200px. 

確かに設定するスクリプトを実行すると、ページネーションリンクは、この

index.php?page_num=2&page_scroll=200; 

ようになります最後のページのDOMをリダイレクトする前にその位置を取得します。あなたがF5を押すと、ブラウザはどのようにしますか?

答えて

5

あなたはページの一部にスクロールするHTMLアンカーを使用することができます。

index.php?page_num=2#YOURID 

またはあなたのJSを使用してそれを設定します。 location.hash

+0

は、ページ上の同じ位置に、それぞれの時間をスクロールするための良いですが、それはおそらく私の掲示板のために良いだろうが、ページが以前にあった位置にあなたを連れて行くことはありません。誰かが私が提案したものよりも洗練された解決策を思いつくことができるかどうかを見ることは興味深いでしょう。 – andrew

+0

この投稿を読んでいる他の人を明確にするだけです。あなたはこの回答に示されているようなリンクをリダイレクトし、ページにはこのようなのようなアンカータグを付けることができますそのアンカーの位置にリロードする場合 – andrew

1

ブラウザの観点からは全く新しいページがロードされているので、あなたが述べた難しい方法がこれを実行する唯一の方法かもしれません。

もう1つの方法は、次の次のページの掲示板をXHR経由で読み込んで、掲示板があるdivの現在の内容を置き換えることです。ページ全体が読み込まれてレンダリングされるのを待つ必要がないため、ユーザーの負担を軽減できます。これは、状況によっては良い選択であるかもしれないし、そうでないかもしれないが、考慮する価値がある。

+1

良い点ajaxはこの状況の解決策かもしれませんし、あなたが正しいです、それはより多くのユーザーフレンドリーな経験になります。 – andrew

3

コードをhttp://webcodingeasy.com/Javascript/Get-scroll-position-of-webpage--crossbrowserから取得し、それを使用してスクロールをページリロードの最後の位置に設定します。

次に、onclick = "saveScroll()"などのイベントを使用するか、スクロール値を保存します。時計を提出した後、魔法が起こる! :)スクロール位置を取得するための関数がから取られた

:HTMLアンカーを使用してhttp://webcodingeasy.com/Javascript/Get-scroll-position-of-webpage--crossbrowser

関連する問題