使用scorllLeft实现轮播代码

来源：互联网发布：用友重装后数据恢复编辑：程序博客网时间：2024/06/04 19:26

直接上代码：

<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css">*{padding: 0;margin: 0;}.fa{width: 1200px;height:600px;margin: 0 auto;overflow: hidden;}.fa-one{width: 500%;height: 100%;position: relative;}.son-a{width: 20%;height: 100%;text-align: center;line-height: 600px;font-size: 100px;float: left;}#aa{width: 100px;height: 60px;margin: 0 auto;}</style></head><body><div class="fa"><div class="fa-one"><div class="son-a" style="background-color: red;">0</div><div class="son-a" style="background-color: orange;">1</div><div class="son-a" style="background-color: yellow;">2</div><div class="son-a" style="background-color: green;">3</div><div class="son-a" style="background-color: blue;">4</div></div></div></body><script src="jquery-1.8.3.min.js"></script><script>(function(){var i=1var fa=document.getElementsByClassName("fa")[0]var aa=document.getElementById("aa")var a=setInterval(function(){    if(i==6){i=1}fa.scrollLeft=1200*i;i++ },1000)})()</script></html>

0 0