Flappy bird game help

Question

my code is called jumpy50, im not sure how to share it,

i want to make it so that when the play button is clicked the object will go down and when canvas or body is clicked the object will go down,

im trying to create a game similar to flappy birs

Answer 1

What I did was I made three functions. One of them was the gravity function which basically just pulls the player down.

One of them was the "world" function which moves the background to the left and randomly generates the pipes.

And the last one was the "playerMovement" function which detects should the player jump or fall with gravity. It checks the player position. If the player hits the pipes or falls to the ground the game is over.

These all three should run on every frame.
And remember if you mess up those. If you make them too complicated or the execution takes too long it affects your fps.

For example I would make the down movement or the gravity like this.
I would have three variables.

"gravityAcc" which is the acceleration. The speed increases over time.
"gravityOn" gravity only works if this variable is true. You may want to change it to false if you want your player to jump.
"gravitySpeed" is the current speed

I calculated the acceleration from window height so its responsive on mobiles.

var player = document.getElementById("player");

var gravityAcc = 0.0085;
var gravityAcc = $(window).width() / 100 * gravityAcc;
var gravityOn = true
var gravitySpeed = gravityAcc;

function gravity() {
if(gravityOn) {
player.css({
top: player.offset().top + gravitySpeed
})
gravitySpeed += gravityAcc;

} else {
gravitySpeed = gravityAcc;
}
}

And if you make games like this, elements positions should be relative to the window. It makes everything easier.