no-image

JavaScript

高さを揃えたレスポンシブな画像ギャラリー「jQuery Mosaic plugin」

jQuery Mosaic pluginは高さを揃えたレスポンシブな画像ギャラリーを実装できるjQueryプラグインです。アスペクト比を維持しながら綺麗に高さを均一化させた画像ギャラリーを実装したい人は要チェックです。

jQuery Mosaic plugin

デモ

デモでは画像が複数行にわたって並べられています。各行の高さはそれぞれで均一になっていて、綺麗に整列されています。画面いっぱいに隙間なく画像が並べられるその姿は圧巻ですね。

また、デモはレスポンシブにも対応しています。画面を縮小していくと画像のレイアウトもそれに合わせて変化していきます。スマホやタブレット、PCなど、その機器にあったレイアウトで快適に閲覧できます。

使い方やマークアップもかなりシンプルなところがグッドです。

オプションには、maxRowHeight、refitOnResize、refitOnResizeDelay、defaultAspectRatio、maxRowHeightPolicy、highResImagesWidthThreshold、outerMargin、innerGap、responsiveWidthThresholdといった項目が用意されています。

jQuery Mosaic plugin

関連記事

  1. multi-list

    JavaScript

    複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

    multi-listは、順序付けされていないリストを複数の選択可能なリ…

  2. evol-colorpicker

    JavaScript

    マイクロソフト オフィス2010のようなカラーピッカー「evol-colorpicker」

    evol-colorpickerは、マイクロソフト オフィス2010の…

  3. photowall

    JavaScript

    Google画像検索のようにサムネイル画像をクリックするとスライド表示されるjQueryプラグイン「…

    Google画像検索のようなアニメーションを実装することができるjQu…

  4. Fixit

    JavaScript

    要素を特定の位置に固定できるjQueryプラグイン「Fixit」

    Fixitは要素を特定の位置に固定することができるjQueryプラグイ…

  5. Tippy.js

    JavaScript

    軽量ながらも多彩なツールチップを実装できるJSライブラリ「Tippy.js」

    Tippy.jsは軽量でありながらも多彩なツールチップを実装することが…

  6. VenoBox

    JavaScript

    画像・Google マップ・YouTubeなどを埋め込めるLightbox風jQueryプラグイン「…

    VenoBoxは色んなコンテンツを埋め込めるLightbox風jQue…

最近の記事

  1. Kindle Oasis
  2. OWL-WDDESK01
  3. ワンタッチ着脱フィルターキット
  4. Soundcore Ace A1

アーカイブ

PAGE TOP