could anyone help me with my little problem, please? A made a little game.
The rules are easy: you have 15 seconds to decide if you know the name written on the screen.
You have two buttons: "i know"/"give up" - depends on what you want to choose.
If you choose "give up" (or time ends) photo 1 appears. Otherwise, photo 2 will be shown.
After every round, word from current round is written below*. Game ends after 5 rounds.
And now my question. As you can see the word written below is not the same word as the main one (this one which appears at the beginning). I think this might be problem with my "var randomWord". In addition, function "surrender" and "winning" don't see it at all.
Where should I put it? Maybe there is better way to do it? Advice required.
I'm just starting with programming, so I'll be grateful for possibly easiest to understand code. Thanks for all help.
Here's my code:
<!DOCTYPE html>
<html>
<head>
<style>
</style>
<script src="/scripts/snippet-javascript-console.min.js?v=1"></script>
</head>
<body>
<div id="word"></div>
<button id= "btnSurrender">give up</button>
<button id= "btnWinning">i know</button>
<p id="seconds">15</p>
<div id="photo"></div>
<div id="wins"></div>
<div id="loses"></div>
<script type="text/javascript">
function getRandomItem(array) {
return array[Math.floor(Math.random() * array.length)]
}
var words = ["Michael", "Simon", "Peter", "Mark"];
function fill_in(){
document.getElementById('word').innerHTML = "";
document.getElementById('word').innerHTML += getRandomItem(words);
}
var btn1 = document.getElementById("btnSurrender");
var btn2 = document.getElementById("btnWinning");
var pic = document.getElementById("photo");
var secondsP = document.getElementById('seconds');
var clock = null;
btn1.addEventListener("click", surrender);
btn2.addEventListener("click", winning);
var round = 0
function timer () {
if (round >= 5){
document.getElementById('word').innerHTML = "";
pic.innerHTML='<img 3.png" alt="">';
secondsP.textContent = "";
return;
}
round += 1
fill_in();
var randomWord = getRandomItem(words);
clearInterval(clock);
var start = new Date().getTime();
clock = setInterval(function() {
pic.innerHTML='<img src="" alt="">';
var seconds = Math.round(15 - (new Date().getTime() - start) / 1000);
if (seconds >= 0) {
secondsP.textContent = seconds;
} else {
clearInterval(clock);
}
if (seconds === 0) {
pic.innerHTML='<img src="img 1.png" alt="">';
document.getElementById("loses").innerHTML += randomWord + " ";
}
}, 1000);
}
function surrender(){
clearInterval(timer);
clearInterval(clock);
pic.innerHTML='<img src="img 1.png" alt="">';
secondsP.textContent = 0;
setTimeout(timer, 2000);
document.getElementById("loses").innerHTML += randomWord + " ";
}
function winning(){
clearInterval(timer);
clearInterval(clock);
pic.innerHTML='<img src="img 2.jpg" alt="">';
secondsP.textContent = 0;
setTimeout(timer, 2000);
document.getElementById("wins").innerHTML += randomWord = " ";
}
timer();
setInterval(timer, 17000);
</script>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire