2008/03/17
JavaScriptを使ってCSSを拡張「MoreCSS」
※ 画像は公式サイトデモより
最近のWeb開発は単純なタグ構成をCSSを使って装飾していくという形式が多い。確かに開発側にとっても単純な構造は分かりやすく、CSSで見た目を変更できるのはデザインとシステムの分離ができ、効率的だ。 0
そしてこのソフトウェアはそれをさらに発展させてくれる。
今回紹介するオープンソース・ソフトウェアはMoreCSS、CSSを拡張するJavaScriptライブラリだ。 0
JavaScriptでCSSを拡張とはどういうことだろうか。例に出すと、例えばテキストボックスにデフォルトで「Search...」という文字を出したいとする。通常、JavaScriptを使ってonClickなどを定義すると思うが、MoreCSSを使えば「default-value:"Search …";」という定義をCSSに書いて、そのIDを当てはめるだけで良い。 0
他にも同じサーバ内の文字列を拾ってきて表示することや、文字列の前後に指定した文字を追加する、新しいウィンドウを開くと言ったアクションが全てCSS内の定義だけでできてしまう。一部の文字だけを表示することもできたり、結果の行ごとに色を変えると言ったこともできるので、様々な場面で役に立ちそうだ。 0
これは一度見ておくと、色々な場面で役立つことが分かるはずだ。デザイナーの人にとっては、複雑なJavaScriptやプログラマに負担をかけることなくCSSだけで様々なアクションができるようになるし、プログラマも複雑なJavaScriptをくむ必要がなくなる。 0
外部の文字列表示などは、SSI的な利用も考えられる。そうなればログイン前と後のキャッシュを共通化できる、なんて便利な使い方も考えられそうだ。これは開発者にとって要注目のライブラリと言えそうだ。 0
via [JS]スタイルシートを機能拡張するスクリプト [ MoreCSS | コリス ] 0
yellowgreen designbüro - MoreCSShttp://yellowgreen.de/morecss 0
MOONGIFTの関連記事
このエントリーを含むTwitter
アンケート