いんやぁ～、めっちゃ大変だったぜよ!!
全然簡単じゃない!!
鼻血出そうだったぜ……ご飯も食べてない。
煙草と青汁とアロエ・ヨーグルトで5時間半!!
アホか!!
しかし、最高っす。
この “ Animated JavaScript Accordion ” は、マジで最高っす。
まま、導入の全貌はあまりに長くなりそうなので、また明日という結論。
とりあえず、どう見ても考えても “ prototype.js ” 仕様にすると重たいという難点があり、せっかくだから全部 “ jQuery ” で統一しようという試みであった。
“ jQuery ” 早ぇし。設定簡単だし。
どうしても写真の表示には “ Lightbox v2.0 ” を使いたかったのだな。
でも、“ prototype ” 仕様だと、遅い。はたまた、IE7 だと、読み込み不可とかまるごと表示してくれないとかいう現象まで引き起こしやがるのな。あれ。
そこで探してみたら、“ jQuery lightBox plugin ” というなんとも便利なプラグインが見つかったわけ。
軽い。簡単。気持ちいい。
しかも、本家のやつより設定も表示のさせ方も超簡単。いちいち “ rel ” を入れなくても、div タグに任意の ID を付加して、そのなかに表示させたい写真群をリストかなんかで列挙してやれば、勝手にギャラリー lightbox にしてくれるってなもんよ。
ただ、やっぱり “ prototype ” は、重い。
そこでまたさらに調べてみたら、最近じゃもうもうもうもう『 google 』さんはいろんなとこに手を差しのべ、そして助けてくれてるらしい。
ゲロ嬉しい “ google API ” とかいうので、“ prototype.js ” とか “ script.aculo.us ” とか、なんかそのへんの重たいライブラリーを貸してくれるシステムを提供してくれてたのだよ!!
こいつは助かる!!
いちいち “ ?effect ” なんとかとかつけなくても OK っぽいし、“ prototype.js ” も “ script.aculo.us ” も、いちいち新しいバージョンと入れ替えなくても、常に最新版を提供してくれるんだよ。
まま、たまぁ～に、ホントたまぁ～ ──── いや、けっこう頻繁に、あの天下の『 google 』さんが ISDN も真っ青なほど非常に重たいときはあれど、最近の『 CORESERVER 』さんよりはマシかなと。
『 CORESERVER 』さん、遅いっす……
えっらい、遅いっす……
そこで、 “ google API ” さんから重たいライブラリーを拝借できるようになってしまった俺様は、はたと考える。
──── “ jQuery ” じゃなくてもいいんじゃないか？
──── せっかくなら、本当に使いたいライブラリーを使ってみてもいいんじゃないか？
──── むしろ、そっちのほうが今後のためにも、俺様の精神衛生上、よろしいのではないか？
いやぁ～、やった。
本当は “ lightview ” っていうのがいいかなと思ってたけど、さらに良さげな “ lightwindow ” というのを発見。
“ lightview ” は、角丸とか背景とか、いろんなのカスタマイズできて楽しい上にゲロかっちょいいんだけど、キャプションとかタイトルとかが面倒くせぇの。それ以外では、ホント非の打ちどころのない画像表示のライブラリーだと思う。
その点 “ lightwindow ” は、なにかとカスタマイズ可能な上、キャプションとかタイトルとかの設定もラクっぽかったわけだ。
あと、なんでも “ lightbox ” 風に表示してくれる。
しかぁ ──────── し!!!!
こちら “ lightwindow ” は、画像やらなにやらをクリックしたあと、グイーンって出てくる ajax なウィンドウが表示されるまでにしばし時間がかかる。
唯一そこが難点。
どうしたって “ jQuery ” のほうが軽い上に、設定もなにかとラクだったりしたようだ。
それは明らかだし、導入もラクちんぽ。
それならなぜ、“ jQuery ” のライブラリーをすぐ捨てられなかったのか？
クソ重てぇ “ prototype ” も “ script.aculo.us ” も『 google API 』とかいうので引っ張ってこれるのを発見したのにも関わらず、本当に使いたいのはそっちだったのにも関わらずである。
それは簡単。
サイドメニューを、最近流行りの “ アコーディオン開閉方式 ” にするため、“ jQuery ” を使わせてもらってたから。
そっちのタイプのほうがライブラリーが軽いためか、スムーズに動いてた。
まま、二つで同棲させちゃおっかなぁ～とも思ったけど、どうも今回の仕様では、 “ jQuery ” と “ prototype ” がダブルブッキングしてしまうらしかったのだな、これがまた。
そこで迷ってたわけ。
それを昨日もおとといもずぅ～っとやってたのよ。
最初は、どうしても軽いほうがいいかもしれまいにと思い、jQuery 統一の方針で “ facebox ” なる超軽い lightview 風のも試してみた。
だが、しかし、こちらはガセかった。
角丸はいいのだよ。うん。
でもさ、その縁が透過した黒のやつなのだな。
なんとも乙女チックでメルヘンチックな感じがして、俺様の色眼鏡は透過せず。
で、本日、バイトから帰ってきてなんやこらとエロゲーを探索してる最中に、発見したのよ!!
“ Animated JavaScript Accordion ”
いやはや、毎度のことながら前説の長いこと長いこと。
本題がくるまでにえっらい時間かかんのな。
こちら “ Animated JavaScript Accordion ” は、スライダーで超なめらかなアコーディオンな動きをしてくれるくせに、“ jQuery ” とか “ prototype ” とか、なんかそのへんの有名もマイナーも問わず、ライブラリーに依存しない Javascript で動いてくれる Accordion なのよ!!
あっ、『詠春』観なきゃいけないのに!!
っつってもまあ、俺様はあんましアコーディオン開閉方式って好きじゃないので、ほかに設置する予定はないんだけどな。
ふむ、詳しいことはまた後日ってことで、こいつはマジでオススメだがや。
ライブラリーに頼って変に重たいのはイヤだけど、アコーディオン表示させたいってんで悩んでる人は、とりあえずこいつを試してみるといい。
HTML とか CSS で変にクラスとか ID とかつけないで、きれいなソースの人は、俺様みたいに苦労しないでズバコーンと設置できそうだぞ。
“ padding ” と “ border ” には、要注意だ!!
- November 13, 2008 12:17 PM
- [ TakuyaMatsuda.org ]
