无聊的人用JS实现了一个简单的打地鼠游戏

先看看老鼠的运动

        　　// 运动操作
            moveUpAndDown: function() {
                var that = this;

                // 定时器随机定义good|bad老鼠个数，以及需要显示的个数
                that.moveTime = setInterval(function() {

                    for (var i = 0, j = that.mouses.length; i < j; ++i) {
                        that.mouses[i].setAttribute('clicked', '0');
                        that.mouses[i].className = 'good active';
                        that.mouses[i].style.display = 'none';
                    }

                    // bad 的个数
                    var badNum = that.getRandom(0, 8);
                    for (var i = 0; i < badNum; i++) {
                        that.mouses[that.getRandom(0, 8)].className = 'bad active';
                    }

                    // 要显示的个数
                    var showNum = that.getRandom(0, 8);
                    for (var i = 0; i < showNum; i++) {
                        that.mouses[that.getRandom(0, 8)].style.display = 'block';
                    }
                }, 2000);
            },

使用定时器，定时器的循环与CSS中的动画设置一致，保证循环连贯性

设置class为good 即可定义出一只好老鼠，同理bad 为坏老鼠

在开始游戏，进行调用时，设置class为active 即可让老鼠运动起来

（编辑：PHP编程网 - 湛江站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!