jQuery Elastic Grid

JavaScript

Google画像検索っぽいイメージギャラリーを実装できる「jQuery Elastic Grid」

jQuery Elastic Gridは、Google画像検索っぽいイメージギャラリーを実装することができるjQueryプラグインです。レスポンシブ対応で軽量、そして使い方も簡単なところがグッドです。ホバーアニメーションもスタイリッシュでとてもかっこいいですね。

jQuery Elastic Grid

jQuery Elastic Grid

たくさんのサムネイル画像が並んでいるデモでは、各サムネイル画像をホバーするとオーバーレイによるアニメーションでタイトルが表示されます。クリックすると、その画像の詳細が表示されます。

Google画像検索のようなレイアウトで表示されるので、使い慣れている人にとっては、違和感なく操作できますね。画像の詳細はクリックすることで表示されるので、余計なスペースを使う必要もなく有効的に活用できます。

また、デモはレスポンシブにも対応しているので、ブラウザ幅に応じて最適なレイアウトに可変していきます。PC、スマホ、タブレットと、さまざまなデバイスで快適なイメージギャラリーを閲覧することが可能です。

使い方もシンプルで記述しやすいほか、ファイルも軽量に仕上がっているので、気軽に導入できそうですね。

スタイリッシュなホバーエフェクトでレスポンシブに対応したGoogle画像検索風のイメージギャラリーを実装できるjQueryプラグインを探している人は、ぜひ「jQuery Elastic Grid」を活用されてみてはいかがでしょうか?

jquery-stepsステップ式のウィザードを実装できるjQueryプラグイン「jquery-steps」前のページ

ページ内をスムーズにスクロールできる「Smooth Scroll behavior polyfill」次のページSmooth Scroll behavior polyfill

関連記事

  1. Cavendish.js

    JavaScript

    CSS transitionsを活用したシンプルなスライドショーを実装できるjQueryプラグイン「…

    CSS transitionsを活用したシンプルなスライドショーを実装…

  2. simpleSlideShow

    JavaScript

    カスタマイズしやすいシンプル・軽量なスライドショー「simpleSlideShow」

    simpleSlideShowは、シンプルで軽量なスライドショーを実装…

  3. jQueryプラグイン

    JavaScript

    jQueryプラグイン・2014年下半期70選まとめ

    今年も残すところ後わずかとなってしまいました。というわけで、2014年…

  4. no-image

    JavaScript

    水平スクロールでテキストが流れていくマーキー実装「hMarquee」

    hMarqueeは、水平スクロールでテキストが滑らかに流れていくマーキ…

  5. jquery.peekABar

    JavaScript

    様々なカスタマイズができる便利な通知バー「jquery.peekABar」

    jquery.peekABarは様々なカスタマイズが可能な通知バー(通…

最近の記事

  1. SV-S251
  2. スラウェシ トラジャ
  3. 梅
  4. CAR-HLD12BK

アーカイブ

PAGE TOP