前の記事 ≪:Web上で簡単Favicon作成「256 Pixels」
次の記事 ≫:CSSを短く書く方法いろいろ

クールで滑らかに動作するscript.aculo.usベースのアコーディオンUI「Accordion v2.0」

2007年09月25日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法

Accordion v2.0 Demo

クールで滑らかに動作するscript.aculo.usベースのアコーディオンUI「Accordion v2.0」。
おなじみのアコーディオン風に伸縮するUIをscript.aculo.us で実装するライブラリが公開されました。



実装は、ライブラリの読み込み&DIVの定義をおこなったあと、次のようなコードで初期化するのみです。

// Horizontal example
var horizontalAccordion = new accordion('#top_container', {
classNames : {
     toggle : 'horizontal_accordion_toggle',
     toggleActive : 'horizontal_accordion_toggle_active',
     content : 'horizontal_accordion_content' },
     defaultSize : { width : 525 },
     direction : 'horizontal'
});

使い方も簡単でprototype.jsベース。
知っておくといつか使えそうです。

関連の記事検索:JavaScript, script.aculo.us, prototype.js, アコーディオン*phpspot
スポンサード リンク

By.KJ : 2007年09月25日 12:09 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)