Question

我知道，这是一个奇怪的。我试图制作一个简单的Javascript游戏：

玩家必须抓住随意落下的头发。
抓住头发会回到头部。
抓住落下的头发会增加分数
随着时间的推移，头发会越来越快。
如果所有的头发落下，那就是GAME OVER。

我已经给了它一个去，并把它的大部分复制到了我的小提琴here，这是我试图实现的一个抽象版本。

当前Javascript：

$(document).ready(function(){

    //randomize hair initial rotation
    $('.hair').each(function(){
        var random = Math.random()*360;
        var degree = "rotate("+random+"deg)";
        $(this).css("transform",degree);
    });

    //set points to 0
    $('#points').text(points);
});

function startGame() {
    start = true;
    var level = 1;

    //move catcher with hand
    $( document ).on("mousemove", function(event) {
        var catcherX = event.pageX - 50;
        $('#catcher').css("left",catcherX);
    });


    $('.hair').each(function() {
        var wait = Math.ceil(Math.random()*10000)/level;
        randomX = Math.random()*($('#gameDiv').width());

        function makeDestination(hair) {
            hair.css("top", 510);
            hair.css("left", randomX);
        }

        setTimeout(makeDestination($(this)), wait)
    })
};

startGame();

我遇到的最大问题是：

如何在随机间隔后使头发掉落？ wait目前尚未在setTimout函数中执行任何操作。
如何在抓住头发功能后重新开始？

我也觉得必须有一个更好的方式来编写这个游戏，你们觉得怎么样？

Answer 1

我使$query = "SELECT * FROM sleep WHERE date='2016-08-21'"; $result = mysql_query($query); if($result) { die("Database query failed"); } else { echo "success"; } if( mysql_num_rows($result) == FALSE) { $mode = "print"; } else { $mode = "edit"; } echo $mode;引用函数而不是立即调用它（将parens调用它并引用返回值，只放入函数名称引用）。然后我调整过渡以使setTimeout动画超过3秒，而top仅需1秒。然后我在延迟后让left自己打电话。最后，＆＃34;头发＆＃34;需要跳回到顶部，所以我将转换更改为立即，更改CSS，然后将转换更改回动画。

https://jsfiddle.net/9pq6xfxc/1/

我留给你检测青色盒子和头发的交叉点。虽然这显然可以在鼠标移动时完成，但找到落在静止手上的毛发会变得更加棘手。

制作问题＆＃34;抓住掉头发＆＃34;游戏

1 个答案: