生成圆角的 jquery 插件

圆角效果

生成圆角的 jquery 插件
代码提取于 thickbox
网址
http://jquery.com/demo/thickbox/

jquery-latest.pack.js 下载地址
http://jquery.com/src/jquery-latest.pack.js

插件代码下载
http://download1.youkuaiyun.com/down3/20070623/23162012797.html

< script  type ="text/javascript"  src ="jquery-latest.pack.js" ></ script >
< style  type ="text/css" > ...
<!--
html, body {...}{
min-height: 100%;
height: auto !important;
height: 100%;
background:#ffffff;
text-align:center;
}

.GGGcontainer
{...}{
    background: #970F00;
    width:300px;
    hei
    margin-bottom:20px;
    color:#fff;
    clear:both;
}
-->
</ style >

< div  class ="GGGcontainer"   >
  < p > ynjob.net  </ p >
  < p > ynjob.net  </ p >
  < p > ynjob.net  </ p >  
</ div >

< p  />
< div  class ="GGGcontainer"   >
  < p > test  </ p >
  < p > test  </ p >
  < p > test  </ p >  
</ div >



< script  type ="text/javascript"   > ...
$(document).ready(function()...{
    $('div.GGGcontainer').corner('round bottom 9px');    //设定圆角 下方
    $('div.GGGcontainer').corner('round top 9px');        //设定圆角 上方
 });


///////////////////////////  圆角 的jquery 插件////////////////////////////
$.fn.corner = function(o)
...{
    o = o || "";
    var width = parseInt((o.match(/(d+)px/)||[])[1]) || 10;
    var fx = (o.match(/round|bevel|fold|notch/)||["round"])[0];
    var opts = ...{
        TL:        /top|tl/i.test(o),         TR:        /top|tr/i.test(o),
        BL:        /bottom|bl/i.test(o),    BR:        /bottom|br/i.test(o)//,
    };
    if ( !opts.TL && !opts.TR && !opts.BL && !opts.BR )
        opts = ...{ TL:1, TR:1, BL:1, BR:1 };
    var strip = document.createElement("div");
    strip.style.overflow = "hidden";
    strip.style.height = "1px";
    strip.style.backgroundColor = "transparent";
    strip.style.borderStyle = "solid";
    return this.each(function()...{
        var pad = ...{
            T: parseInt($.css(this,"paddingTop"))||0,
            R: parseInt($.css(this,"paddingRight"))||0,
            B: parseInt($.css(this,"paddingBottom"))||0,
            L: parseInt($.css(this,"paddingLeft"))||0
        };
        strip.style.borderColor = "#ffffff";
        if ( opts.TL || opts.TR ) ...{
            strip.style.borderStyle = "none "+(opts.TR?"solid":"none")+" none "+(opts.TL?"solid":"none");
            var t=document.createElement("div");
            t.style.margin = "-"+pad.T+"px -"+pad.R+"px "+(pad.T-width)+"px -"+pad.L+"px";
            t.style.backgroundColor = "transparent";
            for ( var i=0; i < width; i++ ) ...{
                var w = fx=="round" ? Math.round(width*(1-Math.cos(Math.asin(i/width)))) : i+1;
                var e = strip.cloneNode(false);
                e.style.borderWidth = "0 "+(opts.TR?w:0)+"px 0 "+(opts.TL?w:0)+"px";
                t.insertBefore(e, t.firstChild);
            }
            this.insertBefore(t, this.firstChild);
        }
        if ( opts.BL || opts.BR ) ...{
            strip.style.borderStyle = "none "+(opts.BR?"solid":"none")+" none "+(opts.BL?"solid":"none");
            var b=document.createElement("div");
            b.style.margin = (pad.B-width)+"px -"+pad.R+"px -"+pad.B+"px -"+pad.L+"px";
            b.style.backgroundColor = "transparent";
            for ( var i=0; i < width; i++ ) ...{
                var w = fx=="round" ? Math.round(width*(1-Math.cos(Math.asin(i/width)))) : i+1;
                var e = strip.cloneNode(false);
                e.style.borderWidth = "0 "+(opts.BR?w:0)+"px 0 "+(opts.BL?w:0)+"px";
                b.appendChild(e);
            }
            this.appendChild(b);
        }
    });
};
</ script >

hegz ：

不需要从thickbox提取代码这么麻烦，你不知道jQuery有一个圆角插件吗？
http://methvin.com/jquery/jq-corner-demo.html