CssUserAgentはJavaScript製/Web用のオープンソース・ソフトウェア。CSSは便利だが、ブラウザによって指定が異なってしまうケースに対応しようと思うと途端に煩雑になってしまう。特にここ数年のようにWebブラウザの種類が増えると大変だ。 0
![]()
このようなクラスが定義される
0
レンダリングエンジンで考えても数多く、さらにバージョンによってレンダリング結果が異なるとなると発狂しそうになってしまうほどだ。そんな苦しむWebデザイナーの方々を救うかもしれないのがCssUserAgentだ。 0
CssUserAgentはua-*というクラス名を自動的に定義するJavaScriptファイルだ。「ua-(ブラウザ名)」「ua-(ブラウザ名)-(メジャー番号)」「ua-(ブラウザ名)-(メジャー番号)-(マイナー番号)」「ua-(ブラウザ名)-(メジャー番号)-(マイナー番号)-(ビルド番号)」「ua-(ブラウザ名)-(メジャー番号)-(マイナー番号)-(ビルド番号)-(リビジョン)」と定義し、HTMLタグに対して追加する。 0
![]()
結果、このように定義できる
0
例えばGoogle Chrome 8.0.552.231であればua-chrome-8-0-552-231といったクラス名が最長になる。さらにレンダリングエンジンごととしてua-webkitというクラス名も利用できる。同様にモバイルか否かの判断にも利用できるJavaScriptオブジェクトも定義される(cssua.userAgent.mobileがtrueになる)。 0
もちろん全てのクラスを使う必要はない。だが詳細にも設定できるというのはニッチなニーズにも的確に対応できるということだ。CSSハック的な技法も使われていないのでクリーンだ。対応ブラウザはMozilla系/IE/Safari/Google Chrome/Opera/iCabと幅広く利用できる。 0
プレミアムユーザには“MOONGIFTはこう見る”、記事の一行概要、追加スクリーンショット、デモや追加URLが表示されます。登録(500円/月)はこちらから! プレミアムユーザのログインはこちらから 0
mckamey / CssUserAgent / source – Bitbucket 0












アンケート