首页 > 代码库 > 一个简单的抽奖程序
一个简单的抽奖程序
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>抽奖程序</title> 6 <script type="text/javascript" src="http://common.cnblogs.com/script/jquery.js"></script> 7 <script> 8 $(function () { 9 var time,10 i,11 idx="01247653",12 items=$(‘.test1‘),13 num=items.length,14 gameOver=true;15 16 $(‘#start‘).click(function(){17 if(gameOver){18 gameOver=false;19 time=Math.random()*20;20 i=7;21 setTimeout(loop,time);22 }23 });24 25 function loop(){26 items.removeClass(‘active‘);27 items.eq(idx.charAt(i%num)).addClass(‘active‘);28 i++;29 if(time<500){//设置阈值30 //时间越长,执行越慢,达到一个缓慢的效果31 //Math.random()*(n-m)+m 返回指定范围的随机数(m-n之间)的公式32 time+= parseInt(Math.random()*(20-10)+10,10);33 setTimeout(loop,time);34 }else{35 gameOver=true;36 alert(items.filter(‘.active‘).text());37 }38 }39 });40 </script>41 </head>42 <body>43 <style>44 .test1,.test2{45 width:20px;46 height:20px;47 border:1px solid red;48 display: inline-block;49 overflow: hidden;50 }51 52 .active{53 background: red;54 }55 </style>56 <div id="container">57 <div class="test1" >1</div>58 <div class="test1" >2</div>59 <div class="test1" >3</div>60 <br/>61 <div class="test1" >4</div>62 <div id="start" class="test2">抽</div>63 <div class="test1" >5</div>64 <br/>65 <div class="test1" >6</div>66 <div class="test1" >7</div>67 <div class="test1" >8</div>68 </div>69 </body>70 </html>
效果:
参考:
http://www.gbtags.com/gb/rtreplayerpreview/195.htm
http://www.gbtags.com/gb/rtwidget-replayer/192.htm
一个简单的抽奖程序
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。