jQuery+CSS3实现的双色球开奖扭蛋机抽奖特效源码.zip

共15个文件

png：12个

css：1个

html：1个

版权申诉

jQuery

80 浏览量 2022-11-06 23:43:37 上传评论收藏 97KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

jQuery+CSS3实现的双色球开奖扭蛋机抽奖特效源码.zip （15个子文件）

132687042146888056

css

style.css 18KB

images

zj_3.png 3KB

canpin_4.png 5KB

mendong.png 1KB

canpin_3.png 3KB

canpin_1.png 5KB

game_ndj.png 21KB

close.png 558B

canpin_2.png 5KB

zj_1.png 5KB

zj_4.png 3KB

an_go.png 3KB

zj_2.png 5KB

index.html 6KB

jquery1.8.3.min.js 91KB

<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="apple-touch-fullscreen" content="YES" /> <meta name="format-detection" content="telephone=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <meta http-equiv="Expires" content="-1" /> <meta http-equiv="pragram" content="no-cache" /> <link href="css/style.css" type="text/css" rel="stylesheet"> <title>jQuery双色球开奖扭蛋机抽奖代码</title>  <script type="text/javascript"> var phoneWidth = parseInt(window.screen.width); var phoneScale = phoneWidth/640; var ua = navigator.userAgent; if (/Android (\d+\.\d+)/.test(ua)){ var version = parseFloat(RegExp.$1); // andriod 2.3 if(version>2.3){ document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">'); // andriod 2.3以上 }else{ document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">'); } // 其他系统 } else { document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">'); } //微信去掉下方刷新栏 if(RegExp("MicroMessenger").test(navigator.userAgent)){ document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { WeixinJSBridge.call('hideToolbar'); }); } </script> <script src="js/jquery1.8.3.min.js"></script> </head> <body> <div class="niu_danji">  <div class="game_qu">  <div class="game_go">100/次</div> <div class="wdjifen">10000</div> </div>  <div class="dan_gund"> <span class="qiu_1 diaol_1"></span> <span class="qiu_2 diaol_2"> </span> <span class="qiu_3 diaol_3"></span> <span class="qiu_4 diaol_4"></span> <span class="qiu_5 diaol_5"></span> <span class="qiu_6 diaol_6"></span>> <span class="qiu_7 diaol_7"></span> <span class="qiu_8 diaol_8"></span> <span class="qiu_9 diaol_9"></span> <span class="qiu_10 diaol_10"></span> <span class="qiu_11 diaol_11"></span> </div>  <div class="medon"><img src="images/mendong.png"></div> <div class="zjdl "> <span></span> </div> </div>  <div class="zonj_zezc none" id="jianpin_one"> <div class="jpzs aiqiyi tc_anima"> <em><img src="images/close.png"></em> <h2> <b>恭喜你！<br>获得一等奖！</b> </h2> </div></div>  <div class="zonj_zezc none" id="jianpin_two"> <div class="jpzs aiqiyi tc_anima"> <em><img src="images/close.png"></em> <h2> <b>恭喜你！<br>获得二等奖！</b> </h2> </div> </div>  <div class="zonj_zezc none" id="jianpin_three"> <div class="jpzs aiqiyi tc_anima"> <em><img src="images/close.png"></em> <h2> <b>恭喜你！<br>获得三等奖！</b> </h2> </div> </div>  <div class="zonj_zezc none" id="jianpin_kong"> <div class="jpzs aiqiyi tc_anima"> <em><img src="images/close.png"></em> <h2> 咦？没有抽中？ </h2> </div> </div>  <div class="zonj_zezc none" id="no_jifeng"> <div class="jpzs aiqiyi tc_anima"> <em><img src="images/close.png"></em> <h2> 对不起，积分不足！ </h2> </div> </div> <script> $(document).ready(function(e) { //一等奖关闭 $("#jianpin_one em img").click(function(){ $("#jianpin_one").hide(); } ); //二等奖关闭 $("#jianpin_two em img").click(function(){ $("#jianpin_two").hide(); } ); //三等奖关闭 $("#jianpin_three em img").click(function(){ $("#jianpin_three").hide(); } ); //没有中奖关闭 $("#jianpin_kong em img").click(function(){ $("#jianpin_kong").hide(); } ); //积分不足关闭 $("#no_jifeng em img").click(function(){ $("#no_jifeng").hide(); } ); var score=470; $(".wdjifen").html(score); $(".game_go").click(function(){ score-=100; if(score<0){ for(i=1;i<=11;i++){ $(".qiu_"+i).removeClass("wieyi_"+i); } $("#no_jifeng").show(); }else{ draw() } }); function draw(){ var number =Math.floor(4*Math.random()+1); for(i=1;i<=11;i++){ $(".qiu_"+i).removeClass("diaol_"+i); $(".qiu_"+i).addClass("wieyi_"+i); }; setTimeout(function (){ for(i=1;i<=11;i++){ $(".qiu_"+i).removeClass("wieyi_"+i); } },1100); setTimeout(function(){ switch(number){ case 1:$(".zjdl").children("span").addClass("diaL_one");break; case 2:$(".zjdl").children("span").addClass("diaL_two");break; case 3:$(".zjdl").children("span").addClass("diaL_three");break; case 4:$(".zjdl").children("span").addClass("diaL_four");break; } $(".zjdl").removeClass("none").addClass("dila_Y"); setTimeout(function (){ switch(number){ case 1:$("#jianpin_one").show();break; case 2:$("#jianpin_two").show();break; case 3:$("#jianpin_three").show();break; case 4:$("#jianpin_kong").show();break; } },900); },1100) //取消动画 setTimeout(function (){ $(".zjdl").addClass("none").removeClass("dila_Y"); $(".wdjifen").html(score); $(".zjdl").children("span").removeAttr('class'); },2500) } }); </script> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p> </div> </body> </html>

评论收藏

内容反馈

版权申诉