日期:2014-05-16  浏览次数:20326 次

教你如何写js小游戏----打字母

从上面掉落字母键盘输入字母,正确通过,错误下一个字母知道错几个

写这个小游戏知道几个关键的东西

1、 onkeydown事件,当鼠标按下时

2、onclick事件,点击

3、var a=(Math.random()*500);  

       Math.random()随机产生0-1的小数

4、String.fromCharCode(65+(a*100)%26)

      将数字转换成char类型的字母

5、event.keyCode

      键盘按下的键对应的值

     String.fromCharCode(event.keyCode)

6、setTimeout("setHeight()",20);

     每个多少毫米调用。。方法

只要知道这几个就差不多了,基本上的js小游戏就差不多了

----------------------下面是我的源码,里面有jquery,不过就用了选择器,方便嘛不用谢document.getElementById(),其他的没用-------------

<html>
 <head>
  <title>
   测试
  </title>
  <style>
   td{
    width:70px;
    border:10px double
   }
   .tr1{
    background:#eeeeee
   }
   .td1{
    background:#ff0000
   }
   .gamediv1{
    background:#eeeeee;
    height:400px;
    width:600px;
    background-image:url("2Q3415W224.jpg");
   }
   .box{
    background:#aa9900;
    height:30px;
    width:30px;
    text-align:center
   }
  </style>
 </head>
 <script src="jquery-1.4.2.js"></script>
 <script>
  $(document).ready(function(){
   $("tr").hover(
     function () {
    $(this).addClass("tr1");
     },
     function () {
    $(this).removeClass("tr1");
     }
   );
   $("td").hover(
     function () {
    $(this).addClass("td1");
     },
     function () {
    $(this).removeClass("td1");
     }
   );
   
   

  });

  function load(){
    $("#s").fadeIn("slow");
   }

  function show(){
   $("#s").fadeIn("slow");
  }
  function out(){
   $("#s").fadeOut("slow");
  }
  
  var zimu;
  var height;
  var width;
  var rightcount=0;
  var errcount=0;

  function startGame(){
   var c= createob();
   zimu=c;
   var a=(Math.random()*500);
   width=a;
   height=20;
   setHeight();
   //setTimeout(startGame,1000);
   //$("#div1").keydown=checkob(c);
  }

  function restartGame(){
   rightcount=0;
   errcount=0;
   var c= createob();
   zimu=c;
   var a=(Math.random()*500);
   width=a;
   height=20;
   setHeig