Question

I have been looking for ages for a game idea I have. I have just started off with JQuery and I want to know how to make a game where you click a button then it respawns in a different position.

All I know is that I would have too make a canvas then generate 2 numbers in the canvas then move it to that position.

How can this be done?

Answer 1

This can be done very simply by manipulating the CSS applied to the button. Here is an example:

JavaScript:

$(document).ready(function(){
    $("#button").on("click", function(){
        var widthMax = $(window).width() - $("#button").width();
        var heightMax = $(window).height() - $("#button").height();

        var randomLeft = Math.random() * (widthMax);
        var randomTop = Math.random() * (heightMax);

        $("#button").css("left", randomLeft).css("top", randomTop);
    });
});

HTML:

<input type="button" style="position: absolute;" id="button" value="Click Me" />