Html
    Css
    Js

    
                        
#banner {
	width:1298px;
	height:360px;
	margin:50px auto;
	position:absolute;
	top:00px;
	left:300px;
}
.imglist {
	list-style:none;
	/*display:none;
	*/
}
.imglist li {
	position:absolute;
	left:0;
	top:0;
}
.imglist li img {
	width:1298px;
	height:360px;
}
.yuanlist {
	float:left;
	position:absolute;
	top:330px;
	left:580px;
}
.yuanlist a {
	width:10px;
	height:10px;
	background:white;
	float:left;
	margin-left:10px;
	border-top-left-radius:50%;
	border-top-right-radius:50%;
	border-bottom-left-radius:50%;
	border-bottom-right-radius:50%;
	z-index:2;
}
.yuanlist a:hover {
	cursor:move;
}
.yuanlist a.cur {
	background:rgba(255,255,255,.6);
}
/*#zhong {
	float:left;
	position:absolute;
	top:100px;
}
*/
#left {
	width:0px;
	height:0px;
	/*background:blue;
	*/
	position:absolute;
	float:left;
	top:140px;
	left:-20px;
	border-width:30px;
	border-style:solid;
	border-color:transparent whitesmoke transparent transparent;
}
#right {
	width:0px;
	height:0px;
	/*background:blue;
	*/
	position:absolute;
	float:left;
	top:140px;
	left:1260px;
	border-width:30px;
	border-style:solid;
	border-color:transparent transparent transparent whitesmoke;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

jQuery轮播图

更新时间:2020-06-03 00:00:03

jquery轮播图适用于网站宣传,首页等多个页面,简单实用

0