<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Title</title> | |
<style> | |
*{ | |
margin:0; | |
padding:0; | |
list-style: none; | |
} | |
.big{ | |
width: 318px; | |
height: 318px; | |
margin:100px auto; | |
} | |
.big>div{ | |
width: 100px; | |
height: 100px; | |
background: pink; | |
float: left; | |
line-height: 100px; | |
text-align: center; | |
border: solid; | |
} | |
.big>div:nth-of-type(5){ | |
background: yellow; | |
cursor: pointer; | |
} | |
#act{ | |
background: red; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="big"> | |
<div class="small" id="act">1</div> | |
<div class="small">2</div> | |
<div class="small">3</div> | |
<div class="small">8</div> | |
<div id="cj">点击抽奖</div> | |
<div class="small">4</div> | |
<div class="small">7</div> | |
<div class="small">6</div> | |
<div class="small">5</div> | |
</div> | |
<script> | |
var arrDiv=document.getElementsByClassName("small"); | |
var oCj=document.getElementById("cj"); | |
var num=0; | |
var shijian=Math.random()*5000+3200; | |
oCj.onclick=function(){ | |
oTime=setInterval(dianji,200); | |
} | |
function dianji() { | |
// for(i=0;i<arrDiv.length;i++){ | |
// for(j=0;j<arrDiv.length;j++){ | |
// arrDiv[j].id="" | |
// } | |
// } arrDiv[i].id="act" | |
num=num+1; | |
if (num>arrDiv.length-1){ | |
num=0 | |
} | |
for(j=0;j<arrDiv.length;j++){ | |
arrDiv[j].id=""; | |
} | |
arrDiv[num].id="act"; | |
setTimeout(tingzhi,shijian); | |
function tingzhi() { | |
clearInterval(oTime) | |
} | |
} | |
</script> | |
</body> | |
</html> |
抽奖转盘
猜你喜欢
转载自blog.csdn.net/weixin_42413689/article/details/80848796
今日推荐
周排行