no-image

JavaScript

グリッドレイアウトによるシンプルで軽量なギャラリー「Grid Gallery」

Grid Galleryはグリッドレイアウトによるシンプルで軽量なイメージギャラリーを実装できます。レスポンシブにも対応し、スッキリしたデザインが見やすく操作性もシンプルでとても良好です。Lightbox機能も備えています。

Grid Gallery

デモ

デモでは美しい画像がグリッドレイアウトで綺麗に並べられています。レスポンシブに対応しているので画面の横幅を縮小・拡大していくと、それに合わせて1列に並べられる画像の数も変わっていきます。

任意のサムネイル画像をクリックすると、その画像が拡大表示されます。拡大時には前後の画像に移動できる左右矢印ボタンやクローズボタンが設置されています。矢印ボタンからだけではなく、キーボードの左右キーからでも前後の画像に移動することが可能です。

クリーンでミニマルなデザインなので、画像がとても映えますね。マークアップ・使い方ともにこちらもシンプルで実装しやすいので、気になる人はぜひチェックしてみてください。

Grid Gallery

Jquery-Slider水平の画像タイムラインを実装できる「Jquery-Slider」前のページ

シンプルで可愛いCSSローディングアニメーション「Three Dots」次のページThree Dots

関連記事

  1. jQuery toTop()

    JavaScript

    シンプル・軽量でカスタマイズもできる滑らかなスクロール「jQuery toTop()」

    jQuery toTop()はトップへ行くための滑らかなスクロールを実…

  2. jExcel

    JavaScript

    Excelと互換性のあるスプレッドシートを埋め込めるjQueryプラグイン「jExcel」

    jExcelは、ブラウザにExcelと互換性のあるスプレッドシートを埋…

  3. ScrollPress

    JavaScript

    スムーズなアニメーションのスクロールトップ実装「ScrollPress」

    ScrollPressは、スムーズなアニメーションによるスクロールトッ…

  4. no-image
  5. PopSelect

    JavaScript

    タグ形式のセレクトボックスをポップオーバーで表示させる「PopSelect」

    PopSelectはタグ付けするような感覚のセレクトボックスをポップオ…

  6. JavaScript

    多層に重なり合う美しいグラデーションの背景を実装できるjQueryプラグイン「SHARDS」

    多層に重なり合う美しいグラデーションの背景を実装できるjQueryプラ…

最近の記事

  1. 甘柿
  2. 冬用のふとん
  3. 田沢湖
PAGE TOP