dimanche 25 février 2018

JS Dice - Assigning Math.random value to an html image using if condition

Hello i'm using Javascript to create a random dice output (from 1-6) including an image of the dice side.
The mathRandomDice function is working fine but my 'if' condition which assigning it to the image is not...
My goal is to assign the Math.random value to an image.

function mathRandomDice() {
    document.getElementById("dice").innerHTML = Math.floor(Math.random() * 6) + 1; 

}

var x = mathRandomDice;

  if (x = 1) {
            d.innerHTML = '<img src=https://image.ibb.co/cQKOhc/dice1.png>';
    }

function mathRandomDice() {
    document.getElementById("dice").innerHTML = Math.floor(Math.random() * 6) + 1; 

}
  body {
    text-align:center;}


/* button */

button {
  display: inline-block;
  padding: 15px 25px;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #4CAF50;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

button:hover {background-color: #3e8e41}

button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
 <h5> Press the button for a random dice number<h5>
    <span id="yournum"></span>
   <p id="dice"></p>
<button onclick="mathRandomDice()">Roll The Dice</button>
<br><br>
   <img src="https://image.ibb.co/cQKOhc/dice1.png" alt="1" class="center">
   <img src="https://image.ibb.co/cmyG2c/dice2.png" alt="2" class="center">
   <img src="https://image.ibb.co/bPNyFx/dice3.png" alt="3" class="center">
   <img src="https://image.ibb.co/fmkJFx/dice4.png" alt="4" class="center">
   <img src="https://image.ibb.co/d6D5vx/dice5.png" alt="5" class="center">
   <img src="https://image.ibb.co/nFqkvx/dice6.png" alt="6" class="center">

Aucun commentaire:

Enregistrer un commentaire