2010年2月アーカイブ

前回の jQuery Corner に関するエントリですが、ChromeとSafariで一部不具合がありました。すみません。

今回リベンジをかけて、下記のブラウザで使えるものを書きました。
Windows IE6～、FF3～、Opera9～、Chrome3～
Macintosh FF3～、Opera9～、Safari4～

サンプルを見る
div重ねなくて済むし、リキッドでいけます。

■解説
1) CSSで、Firefox向けに　-moz-border-radius:14px;　を指定します
2) CSSで、SafariとChrome向けに　-webkit-border-radius:14px;　を指定します
3) CSSだけだとIEとOperaが言うことを聞かないので jQuery-Corner を使う

■注意点
・paddingは角丸半径より大きいものを指定します
・残念ながらborderは実装しておりません