纯javascript实现的小游戏《Flappy Pig》实例

"top"></div><div class="bottom"></div>',
    //柱子宽度
    pillarWidth: 45,
    //柱子上下间隔高度
    pillarGapY: 108,
    //柱子左右间隔宽度
    pillarGapX: 250,
    //上柱子的基础定位值（就是top值，和css写法有关）
    pillarTop: -550,
    //下柱子的基础定位值
    pillarBottom: -500
  };
  return self;
})(flappy || {})

"htmlcode">

"htmlcode">

"htmlcode">

"htmlcode">

"htmlcode">

/**
 * 原生javascript实现的《Flappy Pig》v0.1.0
 * =======================================
 * @author keenwon
 * Full source at http://keenwon.com
 */
var flappy = (function (self) {
  'use strict';
  var controller = self.controller,
    option = self.option,
    pig = self.pig,
    pillar = self.pillar,
    pos = self.position,
    util = self.util,
    $ = self.util.$;
  //主程序
  self.game = {
    init: function () {
      var t = this;
      t._isStart = false;
      t._isEnd = false;
      t._timer = null;
      pig.init(t.fall, t);
      pillar.init();
      pos.init(t.hit, t);
      t.addKeyListener();
    },
    addKeyListener: function () {
      var t = this;
      document.onkeydown = function (e) {
        var e = e || event;
        var currKey = e.keyCode || e.which || e.charCode;
        if (currKey == 32) {
          if (!t._isEnd) {
            t.jump();
          } else {
            window.location.reload();
          }
          util.preventDefaultEvent(e);
        }
      }
    },
    jump: function () {
      var t = this;
      if (!t._isStart) {
        $('start').style.display = 'none';
        t._createTimer(function () {
          pig.start();
          pillar.move();
          pos.judge();
          $('score').innerHTML = pillar.currentId + 1;
        });
        t._isStart = true;
      } else {
        pig.jump();
      }
    },
    hit: function () {
      var t = this;
      t.over();
      pig.hit();
    },
    fall: function () {
      var t = this;
      t.over();
      pig.fall();
    },
    over: function () {
      var t = this;
      clearInterval(t._timer);
      t._isEnd = true;
      $('end').style.display = 'block';
    },
    _createTimer: function (fn) {
      var t = this;
      t._timer = setInterval(fn, option.frequency);
    }
  };
  flappy.init = function () {
    self.game.init();
  }
  return self;
})(flappy || {})




希望本文所述对大家的javascript程序设计有所帮助。

                                
                                

                                    javascript,小游戏,Flappy,Pig 
                                

                                    标签：
                                        
javascript,小游戏,Flappy,Pig
                                     

                            
                        
                        

                            

                                免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！
                                如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
                            
                        
                        

                            

                                
                                    上一篇
                                    
纯js模拟div层弹性运动的方法
                                
                            
                            

                                
                                    下一篇
                                    
JavaScript中利用Array和Object实现Map的方法
                                
                            
                        
                        
                        

                            

                                
                                
                                    评论“纯javascript实现的小游戏《Flappy Pig》实例”
                                
                            
                            

                                

                                    

                                        

                                            

                                                纯javascript实现的小游戏《Flappy Pig》实例
                                            
                                            

                                                
                                            
                                            

                                                

                                                

                                                

                                            
                                            

                                        
                                    
                                    

                                    

                                        
暂无“纯javascript实现的小游戏《Flappy Pig》实例”评论...