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

画像ギャラリーを作成してくれる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/

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

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/

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

  • このエントリーをはてなブックマークに追加

関連記事

親要素の大きさに合わせてテキストをリサイズ「FitText」

「FitText」は親要素の大きさに合わせてテキストをリサイズしくれるjQueryプラグインです。ダウンロード | デモ スクリプト 実装 responsive_head

no image

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

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

様々なタイプのグラフ表示をカバーする「jqPlot」(折れ線グラフ)

Webページにグラフ表示する機会があったので、探してみました。 今回、使用してみた「jqPlot」がシンプルにもできてカスタマイズも豊富でいいです。グラフ用データの形式が少しクセがあり、動的に扱う際

カルーセル プラグイン

「カルーセル(Carousel)」とは"回転木馬"という意味らしいのですが、jQuery(Javascript)では画像やコンテンツをスライド表示させるもののようです。が、スライダーとの違いはよく分り

selectボックスを華麗にしてくれる「Chosen」「Select2」

selectボックスに当てるjQueryプラグインを色々探してみましたがこれに決めました。シングルやマルチ、またグループにも対応しています。インスタンス検索してくれるのが決め手 Chosen CDN

テキストに動きをつけるプラグイン

テキストをフェイド・スライド「Textillate」 テキストをフェイドイン(アウト)、スライドイン(アウト)してくれます。 ダウンロード デモ My Tit

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

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

数値入力スライダー「jQuery Simple Slider」

「jQuery Simple Slider」はスライダーを使用して数値設定が行えるようにしてくれるjQueryプラグインです。"Unobtrusive Numerical Slider"とあるように余

no image

テキストに装飾効果を付けるプラグイン

Burn #テキストに炎のような効果 Burn サイト デモ スクリプト 実装 AAA $(function () { $('#defa

カウントダウン プラグイン

FlipClock #時間 FlipClock サイト [browser-shot url="http://xdsoft.net/jqplugins/flipcountd

Comment

Message

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

*

PAGE TOP ↑