学习jQuery之旅－－使用炫酷的jQuery插件

其中的jquery.accordion.js当然，大家可以制作更炫酷漂亮的效果。

Round

有的时候我们希望页面中的Div实现圆角的效果，Jquery可以很好的满足我们。

效果：点击这里查看效果

Html代码：

<DIV id=main>
<DIV class=demo id="corner1">
<H1>Round</H1>
<P>Hello World!!</P></DIV>


<DIV class=demo id="corner2">
<H1>Round</H1>
<P>Hello World!!</P></DIV>
</DIV>

css和jQuery代码：

　　　 <script type="text/javascript" src="jquery-latest.pack.js"></script>
<script type="text/javascript" src="jquery.corner.js"></script>
<STYLE type=text/css>BODY {
BACKGROUND: #f8f0e0
}
DIV.section {
CLEAR: left
}
H1 {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 150%; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
H2 {
PADDING-RIGHT: 20px; PADDING-LEFT: 20px; BACKGROUND: #ccc; PADDING-BOTTOM: 1px; PADDING-TOP: 1px
}
DIV.demo {
PADDING-RIGHT: 20px; PADDING-LEFT: 20px; BACKGROUND: #c92; FLOAT: left; PADDING-BOTTOM: 20px; MARGIN: 1em; WIDTH: 18em; COLOR: #000; PADDING-TOP: 20px; TEXT-ALIGN: center
}
DIV.fun {
MARGIN: 2px
}
#main
{
height: 269px;
}
</STYLE>

<script　 type="text/javascript">
$(function(){
$("#corner1").corner();
$("#corner2").corner();
});
</script>