2010-11-25 16 views
4

次のページのコンテンツを再帰的に読み込んで現在のページに追加する無限にスクロールされたページを作成しています。私はブラウジングの経験は素晴らしいと没入型であることができると思うが、現在の方法は使い勝手の欠点がないわけではありません。無限にスクロールされたページを逆方向に移動する

プログレッシブエンハンスメントが不完全です。 Ajaxを使用する場合は、バック・ボタンをサポートし、ディープ・リンクを提供することは常に有効です。無限のスクロールの現在の実装はこれをサポートしていません。状態をブックマークする方法はありません。

無限スクロールのUXを改善するためのアイデア。意見が必要です。

  1. 各負荷でURLハッシュを変更します。 /!#/ 2 - > /!#/ 3
  2. 戻るボタンをクリックすると、ページが上にスクロールされます。 [進む]ボタンをクリックすると下にスクロールします。
  3. ディープリンクへのアクセスは、Ajaxの前と同じように動作するはずです。 3ページ目に行くと3ページ目からは、ページ3の内容だけが表示され、2ページと1ページは表示されません。なぜなら、ユーザーはそれらを要求していないからです。
  4. 通常のページネゴシエーションの場合のように、彼が2ページ目と1ページ目に行く方法はまだあるはずです。ページ3にはscrollTopが0でロードされているので、スクロールアップイベントは役に立ちません。このためには、クリック可能なリンクが必要な場合があります。私たちは3ページ

の終わりに2ページのコンテンツをロードしてはならないので、私たちは、あなたたちはどう思いますか?要求されたページ番号は、現在よりも大きいかどうかを確認する必要があり

  • +0

    スクロールアップもサポートしますか?それはこれと関係があるかもしれません... – jcolebrand

    +2

    これはあなたにアイデアを与える必要があります:http://www.20thingsilearned.com/いくつかのブラウザは苦労するかもしれませんが、それらの遅れのための通常の古いページにいつも戻すことができます。 – CurtainDog

    +0

    @CurtainDogは美しいサイトです。私は魅了されています。それはハッシュを使用していないし、ブラウザはさっぱりしていないようです。どうしたの? –

    答えて

    0

    興味深い質問です。 URLハッシュを#!/from/123/to/456の形式で変更し、ページが読み込まれるときにtoのIDを増やすことをおすすめします。

    URLを変更するためにハッシュまたは履歴APIリライトを使用している場合は、UXの意味では、は常に現在のコンテンツの場所を表します。たとえば、ブックマークを期待したり、リロードしたり、他のコンピュータにURLをコピーして「Go」をクリックすると、同じページが返されます。

    無限スクロール・ページがURLのロジックを完成させる唯一の方法は、上記のURLハッシュです。さもなければそれを残す。 TwitterはホームページのURLハッシュを更新しません。

    関連する問題