<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>手写轮播图效果</title>
<style>
#imgsDiv{position: relative;height: 400px;}
.picDiv{
position: absolute;
top:0;
left:0;
width:100%;
height: 400px;
background-position: center center;
background-repeat: no-repeat;
z-index:0;
}
#dotLists{
position: relative;
margin:-30px auto 0;
text-align:center;
height: 20px;
z-index: 20;
}
.dot{
display: inline-block;
width: 12px;
height: 12px;
margin:0 8px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
background: #ccc;
cursor: pointer;
}
.hover{
background: #FF1515;
}
</style>
<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<div ).index();
timeOut=setInterval(function(){
indexNum++;
_this._doNext(indexNum%(_this.$list1.length));
},3000);
},
_stopTimeOut:function(){
clearInterval(timeOut);
}
}
$(function(){
//调用轮播
new Rotation($("#imgsDiv"),$("#dotLists"));
});
</script>
</body>
</html>