「bevel.js」 サンプル


こちらのスクリプトはブラウザによって多少見え方が違う部分があるようです。
「IE6」で見たときが一番綺麗に見えました。 (⌒^⌒)b うん




こちらが何もしていない「標準」の画像です。
指定した「クラス名+オプション」部分の記述をそれぞれ書いてありますので参考にしてください。




class="bavel"
と指定すると標準効果が得られます。



class="bavel iradius40"
と指定すると角の丸さを指定できます。 (20~40 default=20)



class="bavel usemask"
と指定するとマスクがかかるようなのですが・・・「IE」では全体にかかるのですが「firefox」や「safari」などでは、周りだけになってしまうようです・・・自分の場合だけかな? ?(゜_。)?



class="bavel noglow"
と指定すると周りの影がなくなります。



class="bavel iglowopac100"
と指定すると周りの影の濃度を指定できます。 (1~100 default=33)



class="bavel iglowcol0000ff"
と指定すると周りの影の色を指定できます。 (000000~ffffff default=000000)



class="bavel noshine"
と指定すると浮き出てる部分の内枠が無くなります。



class="bavel ishineopac100"
と指定すると内枠部分の濃度を指定できます。 (1~100 default=40)



class="bavel ishinecol00ff00"
と指定すると内枠部分の色を指定できます。 (000000~ffffff default=ffffff)



class="bavel noshade"
と指定すると・・・中枠?部分が効果なしになります。



class="bavel ishadeopac100"
と指定すると中枠部分の濃度を指定できます。 (1~100 default=50)



class="bavel ishadecolffff00"
と指定すると中枠部分の色を指定できます。 (000000~ffffff default=000000)



とこのような感じで細かく設定できます。
それを、複数指定すると下記のようになります。



class="bevel ishadecolffff00 iglowcol0000ff ishineopac80 ishinecolFF0080"
・・・色々な色を使ってみましたが・・・・σ(^◇^;)ヒヤアセ



class="bevel usemask ishadecolffffff ibackcol00ccff ifillcol00aa66"
青系でまとめてクリスタル~な感じ?



class="bevel islinear iglowopac50 ishadeopac75 iglowcolffcc00 ishadecolffcc00"
オレンジ系・・・








設置説明ページはこちら

Leave a Reply

展望台 最上階
「bevel.js」 サンプル 1階