Filterizr

JavaScript

ソートやシャッフルができるギャラリーを実装するjQueryプラグイン「Filterizr」

Filterizrはソートやシャッフルができるレスポンシブに対応したギャラリーを実装するjQueryプラグインです。CSS3 トランジションが使われています。プラグイン自体が軽量になっているところもうれしいですね。

Filterizr

デモ

デモでは全部で9枚の写真が並んでおり、ALL、CITIES、NATURE、INDUSTRIAL、DAYLIGHT、NIGHTSCAPEのどれかのボタンをクリックすると、それに合う写真が絞り込まれます。

また、SHUFFLEボタンをクリックすると、写真がシャッフルされます。そのほか、ASCで昇順、DESCで降順に写真を並べ替えることも可能です。

写真を並べ替えたり絞り込んだりするときのアニメーションも滑らかでとてもいい感じですね。

レスポンシブに対応していることから、PCをはじめスマフォやタブレットにも最適なレイアウトで表示されるところもGoodです。

Chrome、Firefox、Safari、Opera、Android、iOS、Edge、IE(v.10+)がサポートされているとのこと。

軽量でレスポンシブに対応したソートやシャッフルができるギャラリーを実装したい方は、ぜひチェックしてみてください。

Filterizr

関連記事

  1. no-image

    JavaScript

    要素ごとにスクロールできるjQueryプラグイン「snapScroll.js」

    snapScroll.jsは要素ごとにきりのいいところでスクロールされ…

  2. Simply Modal Box
  3. table-dragger

    JavaScript

    ドラッグ&ドロップでテーブルを並べ替えられる「table-dragger」

    table-draggerはドラッグ&ドロップでテーブルの並べ替えを可…

  4. FocusPoint

    JavaScript

    画像の指定した部分を中心にレスポンシブ化できるjQueryプラグイン「FocusPoint」

    FocusPointというjQueryプラグインを使えば、画像の指定し…

  5. Hero slider

    JavaScript

    レスポンシブで横幅フルサイズのスライダーを実装できる「Hero slider」

    Hero sliderはレスポンシブに対応した横幅フルサイズのスライダ…

  6. PopCircle

最近の記事

  1. マリアージュ フレール 紅茶チョコレート
  2. CD-ADE1BK
  3. 渋谷スクランブルスクエアからの夜景
  4. BELTZのバスクチーズケーキ

アーカイブ

PAGE TOP