jQuery+css3手机端扭蛋机积分抽奖代码

查看演示 下载资源 下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<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>