<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*
<!--图片轮播css样式表代码-->
{
margin:0px auto;
padding:0px;
}
#tuijian
{
background-image:url(dasd/1.png);
background-size:cover;
top:290px; height:325px; width:610px; left:27.5%;
position:absolute;
}
.pages
{
background-position:center;
opacity:0.4;
width:78px;
height:110px;
}
#p1
{
background-image:url(images/jiantou1.png);
float:left;
margin:130px 10px 0px 10px;
}
#p2
{
background-image:url(images/jiantou2.png);
float:right;
margin:130px 10px 0px 0px;
}
</style>
</head>
<body>
<!--图片轮播网页显示部分代码-->
<div id="tuijian" >
<div class="pages" id="p1" onClick="dodo(-1)"></div>
<div class="pages" id="p2" onClick="dodo(1)"></div>
</div>
</body>
<!--图片手动与自动的切换-->
<script language="javascript">
var jpg =new Array();
jpg[0]= "url(dasd/1.png)" ;
jpg[1]= "url(dasd/2.png)" ;
jpg[2]= "url(dasd/3.png)" ;
jpg[3]= "url(dasd/4.png)" ;
jpg[4]= "url(dasd/5.png)" ;
var a=document.getElementById("tuijian");
var xb=0;var n=0;
function huan()
{xb++;
if(xb>=jpg.length)
{
xb=0;
}
a.style.backgroundImage=jpg[xb];
if(n==0)
{
var id=window.setInterval("huan()",3000);
}
}
function dodo(m)
{
n=1;
xb=xb+m;
if(xb<0)
{
xb=jpg.length-1;
}
else if(xb>=jpg.length)
{
xb=0;
}
a.style.backgroundImage=jpg[xb];
}
window.setTimeout("huan()",3000);
</script>
