下载是模拟的俄罗斯方法的效果，在下落的情况下，能

 <!DOCTYPE HTML>

 <html>

 <head>

 <title>Shot</title>

 <meta charset="gbk" />

 <link  type="text/css" href="canvas.css" rel="stylesheet"/>

 </head>

 <body onkeydown="getCommand();">

     <canvas id="canvas" width="880" height="400" style="background:black">

     您的浏览器不支持

     </canvas>

 </body>

 <script >

   var canvas = document.getElementById("canvas");

   var cxt = canvas.getContext("2d");

   function Shot(x,y,speed){

     this.x = x;

     this.y = y;

     this.speed = speed;

     this.move = function (){

     if(this.y > 400){

         this.y = 40;

          }

     this.y +=speed;

     }

     this.moveRight = function (){

      this.x +=speed;

     }

     this.moveLeft = function (){

      this.x -=speed;

     }

     this.moveUP = function (){

      this.y -=speed;

     }

   }

   var shot = new Shot(40,40,10);

   //var shots = new Array();

    function drawShot(tank){

               cxt.fillStyle = "#ded284";

               cxt.beginPath();

               cxt.fillRect(tank.x,tank.y,5,10);

               cxt.closePath();

   }

 function getCommand(){

  var code = event.keyCode;

      switch(code) {

         case 87:  //上

           shot.moveUP();

       break;

         case 68:  //右

         shot.moveRight();

       break;

         case 83:  //下

         shot.move();

       break;

         case 65:  //左enemyTanks[i]

        shot.moveLeft();

       break;

       case 74:

       break;

      }

      drawShot(shot);

 }

 function run(){

     cxt.clearRect(0,0,880,400);

         //cxt.clearRect(0,0,880,400);

         shot.move();

         drawShot(shot);

 }

   //function flashTankMap(){

   //刷新作战莵E

     //清历篆布

 //}

 //run();

 window.setInterval("run()",100);

     </script>

 </html>

够对其进行控制，不过做的环形的还是不多

H TML5 之 （7） 俄罗斯方块效果的更多相关文章

  1. H TML5 之 （6）下雨效果

    在对HTML5进行研究之后,有了一点想法,思考出游戏其实感觉就是四个步骤 1.创建一个你需要的对象,赋予属性(一些影响方法的属性),方法(运动,叫....) 2.实例化这个对象,让它成为一个或者多个个 ...

  2. H TML5 之 （5） 一个在线画图板

    这里加入了点难度了,增加了对HTML很多时间的把握,对象的把握 index.html <!DOCTYPE HTML> <html> <head> <title ...

  3. H TML5 之 （3）转动的圆球

    HTML5 练手之二,一个能够为之圆心转动的圆球,原理和时钟的非常像,只是要把握转动的时间控制,同时加入了点渐变色 HTML5 练手之二,一个能够为之圆心转动的圆球,原理和时钟的非常像,只是要把握转动 ...

  4. H TML5 之 （4） 小项目一 时钟

    这里做一个HTML5 入门的练手,一个小时钟项目,可以再上面拓展很多,程序员培养的就是思想 <!DOCTYPE HTML> <html> <head> <ti ...

  5. H TML5 之 （2） 小试牛刀

    基本的HTML都认识到了,就开始运用下了,大的程序的开始,都是从一个一个表达式慢慢的堆积起来的 想开始玩HTML5,就开始理解,它所提供的画布函数各有什么作用,API的具体使用,才能完成自己想要完成的 ...

  6. H TML5 之 （1） 初识HTML5

    新特性 HTML5 中的一些有趣的新特性: 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素,比如 article.foo ...

  7. 你应该知道的10个奇特的 HTML5 单页网站

    网页设计师努力寻找新的方式来展现内容.其中一个大的趋势是单页网站,现在被世界上的一些大的品牌广泛采用,使用它们来为用户提供一个快速,干净和简单的而且​​美丽的网站. 下面是10个令人惊叹的单页 H​​ ...

  8. 值得 Web 开发人员收藏的16款 HTML5 工具

    HTML5 正在迅速改变创建和管理网站的方式.HTML5 在不同的领域让网页设计更强大的.快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5 开发各种网站和应用程序. ...

  9. JavaScript中的文档对象模型

    1. DOM基本介绍1 什么是DOMDOM的英语全称为Document Object Model,翻译成中文就 是文档对象模型.也就是说,将整个文档看作是一个对象.而一个文档又是由很多节点组成的, 那 ...

随机推荐

  1. git图示所有分支的历史

    1.第一种方法 git gui 菜单栏上 repository-->visual all branch history 或者直接使用命令gitk --all 2.在git bash中,使用命令查 ...

  2. bzoj1487

    还是仙人掌,和1023一样的考虑方法比1023简单但比1040难环形dp的处理方法和1040一样 type node=record po,next:longint; end; ..,..] of lo ...

  3. 【转】SourceTree的简单使用

    原文网址:http://blog.csdn.net/u011439289/article/details/42126507 今天开始参与公司项目的代码编写,公司内部采用的是gitlib,所以用到了So ...

  4. 【Android 复习】：Android之ViewFlipper（一）

    屏幕切换指的是在同一个Activity内屏幕见的切换,最长见的情况就是在一个FrameLayout内有多个页面,比如一个系统设置页面:一个个性化设置页面. 通过查看Android API文档可以发现, ...

  5. 【转】从QA到EP

    从QA到EP 两三年以前,和友人谈到 QA(软件质量保证) 这个行业,还有 QA 这个团队的未来,就有了一丝忧虑.而现在,终于有机会实践一下自己之前的想法,在这里分享给大家. 从我有限的从业经验到现在 ...

  6. MonkeyRunner执行Python脚本实例——发送短信增强版

    很久之前就写好的了,准备写个自动执行Monkey的脚本时才想到去找它,还是写在博客里找起来方便. 这次更新了批处理自动连接设备后执行Py脚本,结构如下图: 其中shotscreen为存放截图文件夹,s ...

  7. Unity优化之纹理集

    发现了一个比较好用的插件:ProDrawCallOptimizer. 它是用来合并纹理和材质的,而且用起来非常简便. 操作方法: 1.将包拖入Unity5中:ps:由于版本问题,直接双击包时导入不了 ...

  8. QT5.1在Windows下 出现QApplication: No such file or directory 问题的解决办法

    QT5.0.1在Windows下 出现QApplication: No such file or directory 问题的解决办法 分类: 编程语言学习 软件使用 QT编程学习2013-03-07 ...

  9. ListControl常用操作汇总

    本文根据本人在项目中的应用,来谈谈CListCtrl的部分用法及技巧.当初学习时,查了很多资料,零零碎碎的作了些记录,现在主要是来做个总结,方便以后查阅.主要包括以下十三点内容:基本操作.获取选中行的 ...

  10. PHP配置图文教程

    组合解释:lamp,其英文译为灯,可以方便记忆.其实每个字母代表的是一个英文缩写.l-->Linux,a-->Apache,m-->MySql,p-->PHP 由于以上资源都是 ...