Please help me. I need to make a question game using random image array and its answer when the user input the correct answer.
<! DOCTYPE html>
<html>
<title>
Guess the CharToon
</title>
<head>
<LINK rel="stylesheet" type="text/css" href="F:\ANGELA\MM1\CHARTOON\CSS\samp.css">
<div id="timer" style="padding: 1%;background-color: white;border-radius: 1%;color: black;font-size: 30;font-family: aero; position: absolute;top: 75%;left: 85%;"></div>
</head>
<body>
<h1>From what movie this<br> place can be found?</h1>
<p id="count"></p>
<form>
<img id="pic" class="jpg" src="Nigel Uno.png">
<input type="text" id="anss" class="type1" value="" ></input>
<button class="type2" value="submit" onclick="sub()">Submit</button>
</form>
<a class="back2" href="F:\ANGELA\MM1\CHARTOON\HTML\HARD3.html"><img src="F:\ANGELA\MM1\CHARTOON\IMAGES\MENU\back.png" width="150" height="150"></a>
</body>
<audio src="F:\ANGELA\MM1\CHARTOON\SOUNDS\Main.mp4" autoplay loop hidden> </audio>
</html>
THIS IS MY SCRIPT
<script>
var Imagearray = [];
Imagearray[0] = "Nigel Uno.png";
Imagearray[1] = "perry.jpg";
Imagearray[2] = "BOOTS.jpg";
Imagearray[3] = "SPONGEBOB.jpg";
var a= Math.floor(Math.random()* Imagearray.length);
var anw = [];
anw[0] = "nigel";
anw[1] = "perry";
anw[2] = "boots";
anw[3] = "sponge";
var scor = 2;
function sub()
{
var correct = 0;
if (a == 0)
{
var ans = document.getElementById('anss').value;
if (ans == anw[a] )
{
a= Math.floor(Math.random() * Imagearray.length);
document.getElementById("pic").src = Imagearray[a];
document.getElementById("anss").value = "";
document.getElementById("count").innerHTML= scor + " " +"/5";
correct == 1;
scor++;
}
else
{
if (correct == 0 )
{
hideass++;
document.getElementById("anss").value = null;
}
if (ans == ""){
hideass = 0;
}
}
}
if (a == 1)
{
var ans = document.getElementById('anss').value;
if (ans == anw[a])
{
a= Math.floor(Math.random() * Imagearray.length);
document.getElementById("pic").src = Imagearray[a];
document.getElementById("anss").value = "";
document.getElementById("count").innerHTML= scor + " " +"/5";
correct = 1;
scor++;
}
else
{
if (correct == 0 )
{
hideass++;
document.getElementById("anss").value = null;
}
if (ans == ""){
hideass = 0;
}
}
}
if (a == 2)
{
var ans = document.getElementById('anss').value;
if (ans == anw[a])
{
a= Math.floor(Math.random() * Imagearray.length);
document.getElementById("pic").src = Imagearray[a];
document.getElementById("anss").value = "";
document.getElementById("count").innerHTML= scor + " " +"/5";
correct = 1;
scor++;
}
else
{
if (correct == 0 )
{
hideass++;
document.getElementById("anss").value = null;
}
if (ans == ""){
hideass = 0;
}
}
}
if (a == 3)
{
var ans = document.getElementById('anss').value;
if (ans == anw[a])
{
a= Math.floor(Math.random() * Imagearray.length);
document.getElementById("pic").src = Imagearray[a];
document.getElementById("anss").value = "";
document.getElementById("count").innerHTML= scor + " " +"/5";
correct = 1;
scor++;
}
else
{
if (correct == 0 )
{
hideass++;
document.getElementById("anss").value = null;
}
if (ans == ""){
hideass = 0;
}
}
}
if (Imagearray.length == 3)
{
window.location.innerHTML = ClearEasy();
}
}
window.onload = function timerx(){
var sec = 30;
setInterval(function(){
if (pause == 0)
{
document.getElementById("timer").innerHTML = sec + " " + "Seconds" ;
sec--;
}
if (sec < 0) {
sec = 0;
window.location.assign("Times_up_Easy1.html");
sec = 30;
}
},1000);
}
</script>
I badly need your help please help me. I've tried many ways but I still don't know. the main objective of the game is that the image is display with the input box where the user needs to answer it correctly and add a score and go to another random image. So I need to use a random image array and the array of answer of that image when the user input the right answer the score add 1. Please someone help me. I badly need your help. Please. Thank you in advance. God Bless!
Aucun commentaire:
Enregistrer un commentaire