<!doctype html>
<html>
<head>
<title>抽奖</title>
<meta charset="utf-8">
<style type="text/css">
*{margin:0;padding:0;}
#title{
width:380px;height:70px;line-height:70px;
color:red;font-size:24px;font-weight:bold;
text-align:center;margin:0 auto;
}
.btns{width:190px;height:30px;margin:0 auto;overflow:hidden;}
.btns span{
display:block;width:83px;height: 28px;line-height: 28px;background: #003366;
color: #fff;font-size: 14px;
border: 1px solid #003366;border-radius: 7px;
text-align: center;margin: 0 5px;
float: left;
}
</style>
</head>
<body>
<div id="title" class="title">开始抽奖啦!</div>
<div class="btns">
<span id="play">开 始</span>
<span id="stop">停 止</span>
</div>
<script type="text/javascript">
var data=['Phone5','Ipad','三星笔记本','佳能相机','惠普打印机','谢谢参与','50元充值卡','1000元超市购物券'];
var timer=null;
window.onload=function(){
var title=document.getElementById('title'),
play=document.getElementById('play'),
stop=document.getElementById('stop');
play.onlick=playFun;
stop.onlick=stopFun;
};
function playFun(){
var play=document.getElementById('play');
timer=setInterval(function(){
// var index=Math.floor(Math.random()*data.length);
// title.innerHTML=data[index];
console.log('hello');
},50);
play.style.background="#999";
}
function stopFun(){
clearInterval(timer);
}
</script>
</body>
</html>