MG Space

JavaScript

Google画像のようなアコーディオンプラグイン「MG Space」

MG SpaceはGoogle画像のようなjQueryアコーディオンプラグインです。サムネイルを並べたグリッドスタイルやスライダー、画像とテキストを組み合わせたものなど、いろんなパターンがあります。

MG Space

デモ

デモでは、「Thumbnail Galleries」「Sliders」「Or really anything」の3つのタイプが用意されています。それぞれの項目にある「CLICK ME!」ボタンをクリックすると、その下に各タイプのコンテンツが表示されます。

Thumbnail Galleriesはグリッドスタイルで綺麗に並べられたサムネイル画像が表示され、Slidersは1枚の大きい画像が表示されて左右の矢印ボタンから前後にスライドできるようになっています。

また、Or really anythingでは左側に画像が、右側にはテキストが表示されたレイアウトのコンテンツが表示されます。

ほかにも、ページ下部にBasic Grid Demo、Basic No Grid Demo、Multiple Grid Demo、History Demo、Slick JS Demoといったデモも用意されています。

いろんなパターンがあるので、画像をどのようにユーザーに見せたいか、それに合わせて最適なものをチョイスできるのがいいですね。

使い方・マークアップともに簡単なので、気になる人はぜひチェックしてみてください。ライセンスはMITとのこと。

MG Space

Timelinyレスポンシブ対応の年ベースによるjQueryタイムライン「Timeliny」前のページ

テキストタイピングエフェクトを実装できる「TyperText」次のページTyperText

関連記事

  1. Schedule Template

    JavaScript

    シンプルなスケジュール表を実装する「Schedule Template」

    スッキリしたデザインのシンプルなスケジュールテンプレートを実装するため…

  2. Navi.js

    JavaScript

    ナビゲーションとコンテンツが連動して切り替わるjQueryプラグイン「Navi.js」

    ナビゲーションとコンテンツが連動して切り替わる便利なjQueryプラグ…

  3. no-image

    JavaScript

    画像の遅延読み込みを実装できる軽量ライブラリ「Lazyestload.js」

    Lazyestload.jsは画像の遅延読み込み機能を実装できる軽量の…

  4. Tipso

    JavaScript

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

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

  5. Viewer

    JavaScript

    画像の拡大や縮小、回転などができるイメージギャラリー「Viewer」

    Viewerは画像の拡大や縮小、回転、上下左右の切り替えといった機能を…

最近の記事

  1. King クリーニングティッシュ
  2. PDA-STN36S
  3. クッキー&クリーム ポップコーン
  4. マウイチップス マウイオニオン味
  5. グリーンビーントゥーバー

アーカイブ

PAGE TOP