Progressively

JavaScript

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

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

Progressively

デモ

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

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

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

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

Progressively

Stripe.Com Navigationコンテナがアニメーションで可変するナビゲーション「Stripe.Com Navigation」前のページ

グラデーションが美しい円形カウントダウン「CSS Jquery Pie Countdown Timer」次のページCSS Jquery Pie Countdown Timer

関連記事

  1. FModal.JS

    JavaScript

    シンプルなフルスクリーンのモーダルウィンドウ「FModal.JS」

    FModal.JSはシンプルなフルスクリーンのモーダルウィンドウを実装…

  2. JavaScript

    ライトボックスみたいなお洒落なアラートを出してカスタマイズもできるjQuery uLightBox …

    ライトボックスみたいなお洒落なアラートを表示させることができるjQue…

  3. JavaScript

    軽量(5KB)で機能も色々あるjQueryのスライダー「MobilySlider」を使ってみる

    軽量なんですが、色々と機能もあるいい感じのjQueryプラグイン「Mo…

  4. hummingbird-popover

    JavaScript

    高速・軽量なコンテキストメニュー実装「hummingbird-popover」

    hummingbird-popoverは高速・軽量なコンテキストメニュ…

  5. Lazy Load

    JavaScript

    画像の読み込みを遅らせてスクロールに合わせて表示させるjQueryプラグイン「Lazy Load」

    画像の読み込みを遅らせて表示させることができるjQueryプラグイン「…

  6. Tipso

    JavaScript

    レスポンシブでアニメーションもいい感じのツールチップのjQueryプラグイン「Tipso」

    Tipsoはレスポンシブに対応した軽量でアニメーションもいい感じのツー…

最近の記事

  1. ハムエッグホットサンドとドリップコーヒー
  2. 高輪ゲートウェイ駅のスタバ
  3. 新幹線
  4. リッチモンドホテル
  5. ハーブバターチキン 石窯フィローネとドリップコーヒー

アーカイブ

PAGE TOP