Progressively

JavaScript

画像を徐々に読み込んでくれるJSライブラリ「Progressively」

Progressivelyは画像を徐々に読み込ませることができるJSライブラリです。最初は画像にボカシが入っていますが、スクロールしていくことで画像がくっきり表示されていきます。jQueryなどによるサードパーティーのライブラリに依存することなく使えるのがいいですね。ファイル容量もかなり軽量に仕上がっています。

Progressively

デモ

デモではたくさんの画像が縦に並んでいて、はじめは画像がボカされています。下へスクロールしていくと同時に、ボカされていた画像がくっきり見えるようになってきます。

画像をたくさん載せているページの場合、読み込みが遅くなってしまうケースが多々ありますが、そんなときにこのライブラリを活用するとページ閲覧者にとっても快適になるのではないでしょうか?

マークアップなどの使い方もシンプルなので、手軽に実装できると思います。また、オプションには、throttle、delay、onloadComplete、onload、.render()といった項目が用意されています。

画像を多用するサイトで、画像を徐々に読み込ませる機能を実装したい場合は、ぜひ覚えておきたいJSライブラリといえそうです。

Progressively

関連記事

  1. PWS Tabs jQuery Plugin
  2. Select.js

    JavaScript

    セレクトボックスをオシャレにスタイリングしてくれるJS・CSSライブラリ「Select.js」

    Select.jsはセレクトボックスをシンプルでオシャレにスタイリング…

  3. no-image

    JavaScript

    インスタの写真や動画を表示できる軽量なjQueryプラグイン「Instagram Lite」

    Instagram Liteは指定したユーザーのインスタグラムの写真や…

  4. Simple HTML Menu

    JavaScript

    モバイルにもピッタリなレスポンシブ対応のメニュー実装「Simple HTML Menu」

    Simple HTML Menuは、モバイルにもピッタリなレスポンシブ…

  5. ssi-modal

    JavaScript

    フレキシブルでパワフルなモーダルウィンドウを実装できる「ssi-modal」

    ssi-modalはカスタマイズ性に優れたフレキシブルでパワフルなモー…

  6. Stretchy

    JavaScript

    入力した文字数に合わせて可変するフォーム実装「Stretchy」

    Stretchyは入力した文字数に合わせてボックスが伸び縮みするフォー…

最近の記事

  1. TAP-F27-2KP
  2. M32ミニ
  3. CITTA TT5.0
  4. Kindle Oasis

アーカイブ

PAGE TOP