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 では、動作しないようになっているようです。デモについては以下の本家をご覧下さい。

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


関連記事

この記事のハッシュタグ から関連する記事を表示しています。

CSS3のcolumnを利用してa-blog cmsで段組をサポートする

PhotoCollage.js を a-blog cms のブログテーマに実装してみた

a-blog cms で会員制コンテンツを作り、ログイン前はモザイク画像でチラ見せする実装を解説

CSS3のWeb Fontsを利用して本文中にロゴを出そう

iPad対応のWebを考えてiPad用のCSSを追加する

パソナテック Creator's Meeting In Nagoya Vol.2

最新記事

カテゴリー

アーカイブ

ハッシュタグ