
jQueryで角を丸くするプラグインです。CSSで角を丸する場合は、角丸の画像を作成してCSSの背景に画像を設置する感じで作成しますがjQueryを使って作成すれば、画像を作成する手間が省けますね!!しかも細かい設定もできます♪
デモ
配布ページからダウンロード。
HEADER部分に
<script src="jquery.js" type="text/javascript"></script> <script src="jquery.corner.js" type="text/javascript"></script>
<script type="text/javascript"> $(document).ready( function() { $('.corner-box').corner(); $('.corner-box2').corner({ tl: { radius: 24 }, tr: false, bl: false, br: { radius: 24 }, antiAlias: true, autoPad: true, validTags: ["div"] }); }); </script> <div class="corner-box"> <p>デフォルト設定の場合は、こんな感じに表示されます。デフォルト設定の場合は、こんな感じに表示されます。デフォルト設定の場合は、こんな感じに表示されます。デフォルト設定の場合は、こんな感じに表示されます。デフォルト設定の場合は、こんな感じに表示されます。</p> </div> <div class="corner-box2"> <p>ある特定の部分だけ角丸にしたり、角丸の大きさも自由に決められます。ある特定の部分だけ角丸にしたり、角丸の大きさも自由に決められます。ある特定の部分だけ角丸にしたり、角丸の大きさも自由に決められます。ある特定の部分だけ角丸にしたり、角丸の大きさも自由に決められます。ある特定の部分だけ角丸にしたり、角丸の大きさも自由に決められます。</p> </div>