デザインが魅力的なスライドショーJavaScript (Lightview)
2008年1月17日(木) 08:45
スライドショーを設置しているサイトを目にする機会が多くなってきた。他のサイトと少しでも違いを出したいときに是非検討したいのがLightview。基本的なユーザーインターフェースはLightboxと非常に似ている、細かな部分のデザインに丸みがあるので、角丸を多く採用しているサイトデザインとの相性が良い。
利用するにはprototype.js、scriptaculousが必要になる。lightviewでスライド表示したいイメージを呼び出すには<a rel='lightview[myset]'...の要領で記述していくだけと比較的簡単に利用できる。

ドキュメントとカスタマイズ
詳細なドキュメントは用意されていないが、オプションパラメータや拡張イベントに関する紹介があるので、それらを参考にカスタマイズしていただきたい。
写真を複数指定することもできる、次のスライドを表示するには、Lightbox同様の操作で可能になっている。マウスをのせるとつまみのようなアイコンが表示されるようになっている。
スライドの再生機能も備わっている。しかし、ユーザーが再生リンクをクリックしないと開始されないのが不親切だが、今後のバージョンに期待したい。
関連する記事
- デザインが魅力的なスライドショーJavaScript (Lightview)
- 楽にフォーム入力チェックを実装するJavaScript (JSValidate)
- CSSデザインレイアウトをオンラインで簡単に作成する (YAML)
- ユーザーが再配置可能なWedgetを実装するJavaScript (Prototype Portal Class)
- フォームボタンCSSデザインするテクニック (Rediscovering Button Element)
- 半透明の角まるツールチップを表示するJavaScript (CoolTips)
- JavaScriptでプログレスバーを簡単に実装する (jsProgressBarHandler)
- JavaScriptコード圧縮して盗用から守る (packer)
- iTuneのようにカバーアートを表示するFlash (iTunes Coverflow)
- 画像をサムネイルのサイズで表示するJavaScript (jQuery Thumbs)
- Ajaxでサクサク動くWebファイルマネージャ (Relay)
- アンカータグを利用してスムーススクロールを実装する (df Smooth Scroll)
- MacでもFlashでホイール操作が出来るようにする (SWFMacMouseWheel)
- HTMLなどタグ編集を楽にするエディタ機能JavaScript (jTagEditor)
- 使いやすいYUIライブラリのWYSIWYGエディタ (Rich Text Editor)
- フォトショップで作る80種類のテキストエフェクト集 (photoshoproadmap.com)
- Flashで便利なTweenクラスのわかりやすい解説 (Tween Class Easing)
- CSSレイアウト情報をレイヤー表示するブックマーク (XRAY)
- Lightboxのような透過レイヤー表示の実装サンプル (Lightbox Effect)
- CSSデザインで綺麗なボタンを作成する (How to make sexy buttons with CSS)

