mercredi 21 mars 2018

Switching Images in a Coinflip game

I'm trying to switch images in javascript for if/else depending on the result, but what I've tried doesn't work. How would I fix this?

This is my script:

var coin = document.getElementById(coin);
var coin = Math.round(Math.random());
var result;

if (coin === 1) {
document.getElementById("flip").src = "heads.jpg"
} else {
document.getElementById("coin").src = "tails.jpg"
};

document.write(result);

And this is the html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0">

<title>Decision Maker</title>
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css?
family=Lobster&amp;subset=cyrillic,cyrillic-ext,latin-ext,vietnamese" 
rel="stylesheet">
</head>

<body>

 <h1>Make your decision!</h1>

 <img id="flip" src=".../img/heads.jpg">
 <img id="coin" src=".../img/tails.jpg">

 <script src="js/script.js"></script>

</body>

Aucun commentaire:

Enregistrer un commentaire