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

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>