Loading Emin...

学习模式阶段

导航

实现DIV圆角的js代码和使用方法

这个程序是个用来制作DIV圆角的开源JavaScript代码实现,效果和图像制作圆角一样的.它简单,易用,不用修改任何图像就能做到不同半径圆角....
官方:www.curvycorners.net
---------------------
1、在页面中引用js源文件
< script type="text/JavaScript" src="rounded_corners.js"></script >

2、然后创造一个DIV。如果您已有DIV使用圆角,只要给这个DIV一个id就可以.

         < DIV id="myDiv"></DIV >

3、我们需要添加一段JavaScript来预载。在您的网页的顶头部分增加以下代码:
  

 1<script type="text/JavaScript"> 
 2  window.onload = function() //radius表示半径,数值越大,圆角就越大,各角可以不同大小.
 3  {                                        //tl=左上角  tr=右上角  bl=左下角  br=右下角
 4    settings = {
 5      tl: { radius: 20 },
 6      tr: { radius: 20 },
 7      bl: { radius: 20 },
 8      br: { radius: 20 },
 9      antiAlias: true,
10      autoPad: false
11    }
 
12
13    var divObj = document.getElementById("myDiv"); 
14
15    var cornersObj = new curvyCorners(settings, divObj);
16    cornersObj.applyCornersToAll();
17  }

18
19</script> 


 -------------------------
源示例:demo下载

 

posted on 2006-10-23 23:36  Emin  阅读(1576)  评论(1)    收藏  举报

copyright © Emin