Jag har fått hjärnsläpp och hittar inte lösningen.
10 vita bollar finns utlagda i ett dokument.
Så här ser det ut på index-sidan.
<button onclick="visaBild()">Slumpa nya bollar</button>
<div id="result"></div>
<div id="imgBoard">
<img id="img1" src="img/0.jpg">
<img id="img2" src="img/0.jpg">
<img id="img3" src="img/0.jpg">
<img id="img4" src="img/0.jpg">
<img id="img5" src="img/0.jpg">
<img id="img6" src="img/0.jpg">
<img id="img7" src="img/0.jpg">
<img id="img8" src="img/0.jpg">
<img id="img9" src="img/0.jpg">
<img id="img10" src="img/0.jpg">
</div>
Bild 1 (img/1.jpg) och 2 (img/2.jpg) ska slumpas ut och bytas ut mot de 10 bollarna som redan finns.
Jag har testat slumpen så här och den funkar med ett alert-test men inte mot HTML-sidan:
var bildImg1 = document.getElementById("img1");
var bildImg2 = document.getElementById("img2");
var resTag = document.getElementById("imgBoard");
function newRandomNr () {
randomNumber = Math.floor(2*Math.random())+1;
}
function visaBild () {
if (randomNumber == 1) bildImg1.src = "pics/1.png";
else if (randomNumber == 2) bildImg2.src = "pics/2.png";
}
document.getElementById("result").innerHTML = resTag;
Jag kan gissa att lösningen kanske kan hittas genom en loop.
Är det någon kunnig person som kan hjälpa mig?