枠付きグラデで四角い角を丸くする - Nifty++

丸角を作って1ドットの枠線だけじゃ物足りないということで改良した。

Nifty++ サンプル

  • 片方だけ丸くすることが可能に。
  • 枠の太さを調節可能に。ブラウザが持つ限りどこまでも。
  • グラデーションを付けられるようにした。
  • 内部の要素に同じ背景色と枠線を付加させたりとか

サンプルページ下部の橙色のところにマウス乗せてホイール回せば枠線が増える。キモいぐらいに。

グラデも搭載。思いっきり手抜きな実装してるにもかかわらずそれなりに見える。

あとは一々枠線や背景色設置するの激しくめどー、なのでそれなりに一括で付けられるように。

で、作ってて思ったんだが、JavaScriptでスタイル再設定とかするのは正直よろしくねーなー、と。

基本的にDOMを扱うので実際に動くのはページの読み込みが完了した後。つまり、一瞬でも設定されてない状態が表示されてから設定されることが多発するわけで、その瞬間がどーしても嫌だなーとか思うわけですよ。

まあ、内部的にはそこまでメンドイことしてないんで直接CSSに書き込んだりしてもいいとは思うが・・・それはそれでローカルソースに内容に関係ない要素一杯とかでなんかムカつくのぅ。

となると・・・やっぱりPHPあたりで生成するのが一番なのかもしれんなーとか思ったり。もしくはCSS3が標準装備されて背景画像が複数設定可能になればみんな幸せになれるんだが、一体何年後になるんだ?