シンプルなModal表示JS。シンプルとはいえLightboxよりも多機能で、画像以外にもHTMLやVideo Embedなど様々なフォーマットに対応してます。これ系のLightbox亜種は色々ありますが、トランジションなども含めて綺麗な作りだったので紹介。個人的に残念なのはJSライブラリにmootoolsを使っている点。jQueryの方が色々使いやすい場面多いんスよねー。DLするにはアイコンをドラッグしましょう。あとこのサイト、リロードすると色が変わります。なんだかえらくかっこヨくてシビれました。
サイトのユーザビリティを印象的にする、10のテクニック。主にJavascriptを使った機能面でのサイトの充実を目指すものです。JSといっても、ここではいわゆるデザイン面での装飾ではなく、あくまでもユーザーの利便性を上げるための機能的な補強です。例えばテーブル内のデータをユーザーの都合によってソートする、YouTubeのようにユーザーサイドでレイアウトを変更する、ウィザード形式の入力フォーム、外部リンクにアイコンを追加、iCalライクなカレンダー表示、パスワードの脆弱性チェック、レーティングなどがその内容です。ソーシャル系などの、CGMサイトにおいてあったら便利だな、と思うような内容が多いですね。
MooToolsを使ったクールなスライドショー。ブラインドが開くようなトランジションを使って写真を紹介できます。デモページはこちら。写真の下に、スライドショーの表示時間の残りをプログレスバーで見る事ができる点が機能的にナイス。またCSS3のtext-shadowが細かく使用されていて、デザイン的にもとってもクール。スタイリッシュに写真を見せたい時に使えそうなJavascriptです。
Javascriptを使って表現する、アニメーションするタブやアコーディオンインターフェースをまとめた記事。アニメーションするというだけあって、その多くはjQueryやmootoolsなどのJSライブラリを使用しています。この記事自体はちょっと古いんだけど、紹介されている内容がアツかったので紹介。タブとアコーディオンインターフェースはそれぞれ分けて紹介されてます。CSS 3になると:targetを使う事で、こうした表現もラクチンになりますな。
