专栏首页蚂蚁开源社区【开源游戏/节日】蛋旦很疯狂(新年/元旦专用)

【开源游戏/节日】蛋旦很疯狂(新年/元旦专用)

图片演示:

HTML:

<div id="share" ontouchstart="document.getElementById('share').style.display='none';" onclick="document.getElementById('share').style.display='none';">
    <img src="img/share.png" alt="">
    </div>
  <div id="game">
    <canvas id="cvs" width="640" height="960"></canvas>
    <div class="grid" id="grid">
       <div class="page" id="by-loading">
            <img class="by-loading-bg" src="img/loading-bg.jpg" alt="" />
            <img class="by-loading-logo" src="img/loading-logo.png"  alt="" />
            <div class="by-loading-txt" id="by-loading-txt">loading</div>
          </div>
    </div>
    <div id="o_btn">
            <div id="btn_start"></div>
          <div id="btn_try"></div>
          <div id="btn_more"></div>
          <div id="btn_share"></div>
    </div>
    
    <div id="score"><div id="scoretext">得分:<span>0</span></div></div>
    <div id="score_over"><div id="over_text">疯狂的蛋旦狂奔了<span>0</span>米</div></div>        
  </div>

CSS:

引入css文件

 <link href="css/m.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="css/loading.css?v=3">

JS:

<script src="js/util.min.js"></script>
<script src="js/index.min.js"></script>

本文分享自微信公众号 - 蚂蚁开源社区(mayi_zzfriend),作者:思齐大神

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-12-03

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 简单实用的纯CSS百分比圆形进度条代码解析/源码下载

    percircle是一款简单实用的纯CSS百分比圆形进度条插件。你不需要做任何设置,只需要按该圆形进度条插件提供的标准HTML结构来编写代码,就可以生成一个漂亮...

    用户5997198
  • 基于CSS3技术,炫酷3D立方体预加载loading特效

    这是一款css3炫酷3D立方体预加载loading特效。该特效通过简单的HTML元素和CSS3代码,构建几个立方体不停运动的动画特效,适用于做页面的loadin...

    用户5997198
  • 工作实战案例,瀑布流布局实现(方法:CSS3,原生JS,jQuery)。

    用户5997198
  • jQuery DOM操作

    在目标对象前插入同级兄弟元素(不是头部,而是外面,和对象并列同级),参数和append类似

    bamboo
  • 解决img父元素高度多出3px

      结果运行之后发现,不管是在移动端还是pc端,都会出现这种问题。刚开始以为是父元素初始化了margin和padding的原因,排查css无果,又怀疑是html...

    csxiaoyao
  • django 实现电子支付功能

      思路:调用第三方支付 API 接口实现支付功能。本来想用支付宝来实现第三方网站的支付功能的,但是在实际操作中发现支付宝没有 Python 接口,网上虽然有他...

    希希里之海
  • JavaScript快速实现手动轮播

    这个实现起来还是非常简单的,实现方法也多种多样。今天给大家介绍一个非常巧妙的方法,利用JS中的this。

    ZackSock
  • JQuery干货篇之选择元素

    实例 $("img:odd").css("border","thick double red");选择序号为奇数的img元素 $("img:first")...

    爱撒谎的男孩
  • jquery 操作DOM元素(1)

    .clone()   创建一个匹配的元素集合的深度拷贝。   .clone([withDataAndEvents])     ...

    用户1197315
  • Python数据分析之猫眼电影TOP100

    如果大家经常阅读Python爬虫相关的公众号,都会是以爬虫+数据分析的形式展现的,这样很有趣,图表也很不错,今天了,我就来分享上一次在培训中的一个作品:猫眼电影...

    罗罗攀

扫码关注云+社区

领取腾讯云代金券