ITエンジニア/デザイナ向けにオープンソースを毎日紹介

画像をサイトで一気に紹介したいことがある。ただ画像のサムネイルやリンクを並べるだけでも良いが、それでは味気ない。写真や画像は見せ方次第でその印象が大きく異なる。


ピクチャ 2.png

専用のソフトウェアを使っても良いが、もっと手軽なのはJavaScriptベースのライブラリだ。

今回紹介するオープンソース・ソフトウェアはGalleria、JavaScriptとCSSを使ったスライドショーライブラリだ。

GalleriaはjQueryを使ったスライドショーライブラリで、導入が手軽で見た目もかっこうよく仕上げることができる。デモは二つ用意されており、一つは下にサムネイルの一覧、上にクリックした画像を表示している。


ピクチャ 3.png

二つ目は左側に一覧が、右側に大きな画像が表示される。イメージタグのtitle属性に記述した内容が表示されるので、画像ごとにメッセージをつけるのも簡単だ。マウスが当たった画像だけ明るく表示されたり、写真の切り替わる際にフェードイン/アウトしながら表示されるのが格好いい。

写真がメインのサイトに限らず、画像を並べて表示する機会はよくあるものだ。こうしたライブラリを活用すれば、見栄えのいい写真表示ができるはずだ。

 

Galleria - a Javascript Image Gallery

 http://monc.se/galleria/

galleria - Google Code

 http://code.google.com/p/galleria/



 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2