你的位置:首页 > 软件开发 > Java > JAVASCRIPT实现网页版:俄罗斯方块

JAVASCRIPT实现网页版:俄罗斯方块

发布时间:2015-11-26 01:00:27
HTML+CSS+JS实现俄罗斯方块完整版,素材只有图片,想要的下载图片按提示名字保存,css中用的时候注意路径!!主要在JS中!JS附有详细注释效果:按键提示:[键盘按键]素材:图片名字与代码里对应  1、背景图片:tetris.png    2、失败时候的弹出框图片:game ...

JAVASCRIPT实现网页版:俄罗斯方块

HTML+CSS+JS实现俄罗斯方块完整版,素材只有图片,想要的下载图片按提示名字保存,css中用的时候注意路径!!主要在JS中!JS附有详细注释

效果:

JAVASCRIPT实现网页版:俄罗斯方块

按键提示:[键盘按键]

JAVASCRIPT实现网页版:俄罗斯方块

素材:图片名字与代码里对应

  1、背景图片:tetris.png

  JAVASCRIPT实现网页版:俄罗斯方块

  2、失败时候的弹出框图片:game-over.png

  JAVASCRIPT实现网页版:俄罗斯方块

  3、七种色彩小方块图片:

    I.png:JAVASCRIPT实现网页版:俄罗斯方块

    J.png:JAVASCRIPT实现网页版:俄罗斯方块

    L.png:JAVASCRIPT实现网页版:俄罗斯方块

    O.png:JAVASCRIPT实现网页版:俄罗斯方块

    S.png:JAVASCRIPT实现网页版:俄罗斯方块

    T.png:JAVASCRIPT实现网页版:俄罗斯方块

    Z.png:JAVASCRIPT实现网页版:俄罗斯方块

HTML代码

<!DOCTYPE html><html>  <head>    <meta charset="UTF-8" />    <title>俄罗斯方块 — 经典完整版</title>    <link rel="stylesheet" href="css/tetris.css"/>    <script src='/images/loading.gif' data-original="js/shapes.js"></script>    <script src='/images/loading.gif' data-original="js/tetris.js"></script>   </head>  <body>    <div class="playground">      <p>SCORE:<span>0</span></p>      <p>LINES:<span>0</span></p>      <p>LEVEL:<span>1</span></p>    </div>         </body></html>

原标题:JAVASCRIPT实现网页版:俄罗斯方块

关键词:JavaScript

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。