2010年04月02日

CurvyCornersはCSS3に対応した最強の角丸JavaScriptだ！

今、作っているサイトで透過の角丸JavaScriptが必要になって、いいものは無いかと探していると「CurvyCorners」というJavaScriptが見つかりました。

Googleで CurvyCorners - Google 検索 を検索してみると、以下のようなエントリーがヒットします。（上位5件を表示）

これを見ると随分古くからある JavaScript であるという事が分かります。そして、凄いのは 2010年4月1日に新しいベータ版がリリースされています。開発が止ってないんです。

We've just released CurvyCorners 2.1 BETA.

Over 50 bug fixes and improvements:

  • Improved browser detection
  • Lots of CSS detection improvements
  • Support for CSS3 shorthand selectors
  • Support for native CSS border-radius support in Opera 10.5
  • and many more.

もっと、もっと、凄いのは CSS3 の border-radius を認識して自動で出来ない子(IE)のために角丸を作ってくれる事です。 これ凄くないですか？ なので、利用方法としては、この curvycorners.src.js を ＜head＞内で読み込むだけでOK なのです。どんな角丸なのかはCSS側で設定しましょう！

.myBox {

    /* Do rounding (native in Firefox and Safari) */
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

Firefox や Safari では、動作しないようになっているようです。デモについては以下の本家をご覧下さい。

そして、ダウンロードは以下からどうぞ！

シェアする | Yahoo!ブックマークに登録

関連タグJavaScriptCSSCSS3

関連エントリー

上記のエントリーについているタグと関連にするエントリーをいくつかピックアップしています。

login

a-blog cms