<!DOCTYPE html><html><head><meta charset="UTF-8"><title>轮播图</title><style type="text/css">*{margin: 0px;padding: 0px;text-decoration: none;}#rongqi{width: 600px;height: 400px;border:3px solid #333;overflow: hidden;position: relative;left: 400px;top:100px;z-index: 1;}#list{width: 4200px;height: 400px;position: absolute;z-index: 1;left: -600px;}#list img{float: left;width: 600px;height: 400px;}#button{position: absolute;left: 650px;top:450px;z-index: 2;width: 100px;height: 10px;}#button span{cursor: pointer;float: left;border: 1px solid #fff;width: 10px;height: 10px;border-radius: 50%;background: #333;margin-right: 5px;}#button .on{background: orange;}.jt{cursor: pointer;/*display: none;*/line-height: 39px;text-align: center;font-size: 36px;color: #fff;font-weight: bold;width: 40px;height: 40px;z-index: 2;background: black;position: absolute;top:280px;}.jt:hover{background-color: rgba(0,0,0,.6);}/*#rongqi:hover .jt{display: block;}*/#left{left: 440px;}#right{left: 930px;}</style><script type="text/javascript">window.onload=function(){var rongqi=document.getElementById('rongqi');var left=document.getElementById('left');var right=document.getElementById('right');var button=document.getElementById('button').getElementsByTagName('span');var list=document.getElementById('list');function an (offset){list.style.left=parseInt(list.style.left)+offset +'px';}left.onclick =function(){ an(-600); }right.onclick =function(){ an(600); }// left.onclick=function(){change(600);} // right.onclick=change(-600);// function change(target){// list.style.left=parseInt(list.style.left)- 600 +'px';// }}</script></head><body><div id="rongqi"><div id="list" ><img src="5.jpg"/><img src="1.jpg"/><img src="2.jpg"/><img src="3.jpg"/><img src="4.jpg"/><img src="5.jpg"/><img src="1.jpg"/></div></div><div id="button"><span index="1"></span><span index="2"></span><span index="3"></span><span index="4"></span><span index="5"></span></div><div id="d"><a href="javascript:" id="left" ><</a><a href="javascript:" id="right">></a></div></body></html>
添加回答
举报
0/150
提交
取消