タグ

スクロールに関するsinfdのブックマーク (4)

  • scrollMonitor - 大量のデータもスムーズにスクロール

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Web上で大量のDOMを表示するのは自殺行為です。Webブラウザの動きがガクガクになったり、フリーズしてしまったりします。そのためページネーションが使われるのですが、業務要件として全データの表示を求められることは多々あります。 そんな時にはscrollMonitorを使ってみましょう。大量のデータであってもスムーズなスクロールが可能になります。 scrollMonitorの使い方 利用例です。実際に表示されているのはこの見えている部分だけで、黄色と紫色の部分は消えたり、新しくDOMに追加表示されます。 見出しを残してスクロールもできます。 scrollMonitorではデータはメモリ上にありますが、それをスクロールにあわせて描画しています。また、不要になった部分は破棄しています。こ

    scrollMonitor - 大量のデータもスムーズにスクロール
  • WordPressでコンテンツを無限スクロール表示させる方法を導入してみた結果 - ShoYamane Blog

    2015-08-25 WordPressでコンテンツを無限スクロール表示させる方法を導入してみた結果 Web WordPress たまにはちゃんとWeb屋さんらしいことやってるんだぞ!という記事を。 皆さん、無限スクロールのサイトを見たことがあるでしょうか。そうです!記事下辺りに行くとURLが変わって新しい記事が出現するサイトです。以下のようなWebサイトで導入されています。 MTRL | 明日のモテるを配信中! TABI LABO PhotoshopVIP(スマホのみ) 自分も一度やってみたいなと思いまして実装してみました。 実装方法 実装方法は自分が調べたところ大きく分けて以下の2パターンぐらいあるんじゃないのかなと思うのですが、 jQuery.pjaxとjQuery.bottomを使う infinite scrollを使う 今回は1番目の「jQuery.pjaxとjQuery.bot

    WordPressでコンテンツを無限スクロール表示させる方法を導入してみた結果 - ShoYamane Blog
  • Tumblrの省メモリーな無限スクロール - 記録

    無限スクロールまたはauto pagingと呼ばれるUIには、読み終えたコンテンツがどんどん画面の上のほうに溜まっていってメモリーをい潰すという問題がある。 なかでもTumblrは画像などのコンテンツが多いため、ダッシュボードダイバーたちは無限Tumblrユーザースクリプトなどのユーザースクリプトをインストールして、読み終えたコンテンツを定期的にページ上から自動削除するといった対策を講じていた。 ところが最近のTumblrのダッシュボードでは、ポストが画面外に出るとその中の要素が一時的にページから削除され、画面内に表示されると要素が再度復元されるようになっている。どうやらこれによって無限スクロールによるメモリーの圧迫が抑えられているらしい。 関連するコードはhttps://secure.assets.tumblr.com/assets/scripts/dashboard.jsの/*! s

  • これはすごい!スクロールすると世界が変わるカッコ良すぎるウェブサイト4選+α

    こんにちは、にっしーです。 今回は衝撃を受けたスクロールデザインのウェブサイトを紹介します。 一見普通なウェブサイト。スクロールしたら世界変わります。Let's scroll!:) ※ブログ読者のみなさんに教えていただいたサイトも随時追加しています:) http://balloon.am/ http://2011.beercamp.com/ http://bloom.io/ http://www.nikebetterworld.jp/ ここから+α http://www.nintendo.com.au/gamesites/mariokartwii/ via @attripさん http://sai-zen-sen.jp/special/reddragon/ via @satorumurmurさん いかがでしたか? 「衝撃受けた!」って人はTwitterやFacebookで拡散していただける

    これはすごい!スクロールすると世界が変わるカッコ良すぎるウェブサイト4選+α
  • 1