找传奇、传世资源到传世资源站!

html5 砸金蛋 示例源码

8.5玩家评分(1人评分)
下载后可评
介绍 评论 失效链接反馈

实现h5砸金蛋效果from clipboard
from clipboard
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/jquery.js"></script></head><body><div> <div class="click-egg"> <!--dan 1--> <a class="jd jd-1 btn1" href="javascript:"> <div class="jd-per">&nbsp;</div> </a> <!--dan 2--> <a class="jd jd-2 btn2" href="javascript:"><div class="jd-per">&nbsp;</div></a> <!--dan 3--> <a class="jd jd-3 btn3" href="javascript:"><div class="jd-per">&nbsp;</div></a> </div> <div class="click-egg"> <!--dan 1--> <a class="jd jd-1 btn1" href="javascript:"> <div class="jd-per">&nbsp;</div> </a> <!--dan 2--> <a class="jd jd-2 btn2" href="javascript:"><div class="jd-per">&nbsp;</div></a> <!--dan 3--> <a class="jd jd-3 btn3" href="javascript:"><div class="jd-per">&nbsp;</div></a> </div> <div class="cz" id="js-cz" style="display:none;"><!--开砸状态添加样式 zjd--></div></div><script> $(document).ready(function() { popups($(".btn1"),$(".pop_box1")); popups($(".btn2"),$(".pop_box2")); popups($(".btn3"),$(".pop_box3")); popups($(".btn4"),$(".pop_box4")); }); /***弹出框**/ function popups(btn,nowing) { btn.click(function(event) { $("#popups").show(); nowing.slideDown(); }); $(".b_close").click(function(event) { $("#popups").hide(); nowing.hide(); $(".click-egg a").addClass("jd").removeClass("eggover") }); } $(function(){ $(".click-egg").mouseover(function(){ $("#js-cz").show(); }).mousemove(function(e){ $("#js-cz").css({ left:e.pageX 2, top:e.pageY 2 }); $("#js-cz").addClass("zjd"); }).mouseout(function(e){ $("#js-cz").hide(); $("#js-cz").removeClass("zjd"); }) $(".click-egg a").click( function(){ $(this).removeClass("jd").addClass("eggover") } ) })</script></body></html>

评论

发表评论必须先登陆, 您可以 登陆 或者 注册新账号 !


在线咨询: 问题反馈
客服QQ:174666394

有问题请留言,看到后及时答复