模仿新浪微博个人主页的轮播广告效果，jQuery实现，代码很少，只需要简单的修改样式表就可以变成自己想要的样子，右上角带有关闭按钮，用户可以自行关闭广告
查看演示页面 View Demo 查看全部代码 View Code
在网页<head>区添加以下代码
<script type="text/javascript" src="js/jquery-1.4.2.js"></script> <script type="text/javascript" src="js/slider.js"></script> <link href="css/index.css" rel="stylesheet" type="text/css" />
在网页<body>区添加以下代码
<div class="content_right">
<div class="ad" >
<ul class="slider" >
<li><a href="http://www.sharejs.com"><img src="images/buttom_0.jpg"/></a></li>
<li><a href="http://www.sharejs.com"><img src="images/buttom_1.jpg"/></a></li>
<li><a href="http://www.sharejs.com"><img src="images/buttom_2.jpg"/></a></li>
<li><a href="http://www.sharejs.com"><img src="images/buttom_3.jpg"/></a></li>
</ul>
<ul class="num" >
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<div class="close">x</div>
</div>
如果要调整图片高度和宽度，打开index.css文件有两处定义了宽度和高度，一是容器的，一是图片的，都需要修改
.content_right .ad {
margin-bottom:10px;
width:540px;
height:225px;
overflow:hidden;
position:relative;
}
.content_right .slider,.content_right .num , .content_right .close{
position:absolute;
}
.content_right .slider li{
list-style:none;
display:inline;
}
.content_right .slider img{
width:540px;
height:225px;
display:block;
}
将
width：540px;
height:225px;
修改成你需要的宽度和高度
