首页 > 其他 > 详细

砸蛋游戏

时间:2017-03-22 19:23:43      阅读:148      评论:0      收藏:0      [点我收藏+]

html

<img src="img/chuizi.png" class="chuizi"/>
<div id="resultTip" class="redborder"></div>
<div id="eggs">
<div class="egg" isbreak="false"></div>
<div class="egg" isbreak="false"></div>
<div class="egg" isbreak="false"></div>
</div>

 

js

$(function() {
var num = Math.floor(Math.random()*3+1);//生成一个向下取整的随机数
var icount=0;//记录点击次数

$(".egg").mouseover(function() {
var eggleft = $(this).offset().left;//获取金蛋距左的位置
$(".chuizi").css("left", eggleft + 120);//修改锤子的位置
});

$(".egg").click(function() {
$(this).css("background-image", "url(img/egg_2.png)");
icount++;
if(icount>3)
{
$(‘#resultTip‘).text("蛋砸完了");
return;
}

if($(this).attr("isbreak") == "false") //判断鸡蛋是否已被砸
{
$(this).attr("isbreak", "true");//被砸后,修改状态
var i=$(this).index()+1;//金蛋的索引
if(i==num)
{
$(‘#resultTip‘).text("中奖了");
}else
{
$(‘#resultTip‘).text("未中奖了");
}
}
});
});

砸蛋游戏

原文:http://www.cnblogs.com/bkyj/p/6601306.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!