ナビゲーション内にサムネイルを設置できる画像スライダー・ギャラリー用プラグイン

画像ギャラリーを作成してくれるjQueryプラグインはたくさん制作されています。その中でもサムネイルを使用してギャラリーのナビゲーションを行ってくれるプラグインをいくつか集めてみました。

サムネイルを自動生成

プラグインが自動的にサムネイルを設置してくれます。

画像ギャラリーを実装できる「Galleria」
色々なタイプの画像ギャラリーが実装できる「Rondell」

http://showcase.awkwardgroup.com/index2.html
Awkward Showcase
#サムネイル縦並び
Awkward Showcase サイト

http://spaceforaname.com/galleryview/demo-captions.html
GalleryView
#title属性をキャプション
GalleryView サイト

http://pgwjs.com/pgwslideshow/
PgwSlideshow
#レスポンシブ #Zepto.js
PgwSlideshow サイト

http://www.pikachoose.com/
Pikachoose
#キャプションはspan要素で生成(tooltip) #IE7+
Pikachoose サイト

http://tikslus.com/tiksluscarousel/demo

Tikslus Carousel

#レスポンシブ #フルスクリーン
Tikslus Carousel サイト


サムネイルを設置できるギャラリー

ナビゲーションにサムネイルを設置できますが、サムネイル画像は用意する必要があります。

シンプルでカスタマイズ豊富なスライダー用プラグイン「bxSlider」
表示パターン豊富なスライダー「flexslider 2」
レスポンシブに対応した画像ギャラリーが実装できる「Responsive Image Gallery」

http://www.twospy.com/galleriffic/example-2.html
Galleriffic
Galleriffic サイト

http://jgallery.jakubkowalczyk.pl/demo.php
jGallery
jGallery

http://www.jqueryslidershock.com/
jQuery Slider Shock
#サムネイル縦並び,

http://yevhentiurin.github.io/jsphotocradle/
PhotoCradle
#JSON対応
PhotoCradle サイト

http://steverydz.github.io/simpleGal/demo/
simpleGal
simpleGal サイト

http://www.electricprism.com/aeron/slideshow/example5.html
Slideshow 2!
#サムネイル縦並び
Slideshow 2! サイト

Related

Default Thumbnailシンプルな画像スライダー/ギャラリー用プラグイン Default Thumbnailスワイプ対応の画像スライダー・ギャラリー用プラグイン レスポンシブ対応の画像スライダー・ギャラリー用プラグイン Default Thumbnailスライダー・ギャラリー プラグイン iTunesのCover Flowのようなギャラリーが実装できる「ContentFlow」 ECサイトの商品表示に使えそうなスライダー「Simple Multi-Item Slider」 カルーセル プラグイン レスポンシブに対応した画像ギャラリーが実装できる「Responsive Image Gallery」
  • このエントリーをはてなブックマークに追加

関連記事

画像ギャラリーを実装できる「Galleria」

Galleriaは、わずか数行で画像ギャラリーが作成できるjQueryプラグインです。Airbnbのページで使用されていて、コレいいな～と思い試してみました。 ナビゲーション内にサムネイルを

no image

数値入力に便利なステッパーを実装「Numeric Stepper」

「Numeric Stepper」は、数値用のステッパーを実装できるjQueryプラグインです。ダウンロード | デモ スクリプト 実装 既存のテキストボックスにclas

入力テキストの文字数をカウントしてくれる「Textchange」

Twitterのようにinputやtextareaに入力した際に、文字数をカウント(ダウン)してくれるとユーザの利便性が上がります。今回使用したTextChangeは、それ以外にも入力のイベントに対し

no image

定期的にAjaxリクエストを送信してくれる「PeriodicalUpdater」

PeriodicalUpdaterは、定期的にpostもしくはgetリクエストを送信してくれるjQueryプラグインです。Twitterのタイムラインのように定期的にツイートをロードしてくれるようなや

Bootstrap Modal + 拡張機能が実装できるプラグイン

Twitter Bootstrap Modalは、標準のモーダルウィンドウに様々な機能を追加することができます。 2014/06/16 Bootstrap3対応版に書き換えをしました。

no image

時刻入力に便利な「Timepicker for Bootstrap」(Bootstrap 2)

「Timepicker for Bootstrap」は、テキストボックスへの時刻入力を便利にしてくれるjQueryプラグインです。 目次 実装方法 モダール形式 Datepicker

no image

ポップアップ・モーダル ウィンドウ プラグイン

ポップアップ シンプルにポップアップを実装できる「PopBox」 実装方法が選べるツールチップ用プラグイン「Smallipop」 Bootstrap Popovers

リストをインクリメント検索・ソートできる「List.js」

List.jsは、リストをインクリメント検索やソートができるjQueryプラグインです。 ダウンロードはこちら リストだけでなくテーブルにも実装可能のようです。 スクリプト

クレジットカード番号のバリデーションとカード会社を特定してくれる「jQuery Credit Card Validator」

「jQuery Credit Card Validator」は、クレジットカード番号のバリデーションを行ってくれるjQueryプラグインです。入力したカード番号の検証とそれに基づいてカード会社の表示を

タブを画面サイズによってアコーディオンにしてくれる「Easy Responsive Tabs to Accordion」

「Easy Responsive Tabs to Accordion」はタブ表示を画面サイズによって折りたたみのアコーディオン形式に変換してくれるjQueryプラグインです。 デフォルトでは、768

Comment

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

PREV
投稿記事から「(ログイン)ユーザー名」がバレるのを防ぐ
NEXT
RSSフィードの取得

新規投稿

  • ブックマーク

    PAGE TOP ↑