Homework SourseI need help finishing my reading game for elementary student
I need help finishing my reading game for elementary students. I want it to be a remembering game. The kids have a certain amounts of seconds until the words disappear and the only way to get it right is that they have to type in what that fruit or thing is in order to get it correct. Please help.
<html>
<head>
<script type=\"text/javascript\">
<!-- method to perform action -->
click=0;
function func(link)
{
document.getElementById(\"app\").src=link;
click++;
if(click>1)
<!-- clearing timer -->
clearTimeout(timer);
onTimer();
}
i=60;
<!-- setting timer -->
function onTimer() {
document.getElementById(\'time\').innerHTML = i;
i--;
if (i < 0) {
alert(\"Time out Kid\");
}
else {
timer= setTimeout(onTimer, 1000);
}
}
</script>
</head>
<body>
<center>
<!-- just a heading of game -->
<h1 style=\"color:blue;\">Lets Play The Game </h1>
<div float=\"left\">
<!-- table with words -->
<table border=\"3\" hieght=\"200\" width=\"300\">
<tr><td onclick=\"func(\'https://pixabay.com/static/uploads/photo/2013/07/13/11/34/apple-158419_960_720.png\')\"><b>Apple</b></td><td onclick=\"func(\'https://s-media-cache-ak0.pinimg.com/236x/07/c3/45/07c345d0eca11d0bc97c894751ba1b46.jpg\')\"><b>Cat</b></td></tr>
<tr><td onclick=\"func(\'http://kids.nationalgeographic.com/content/dam/kids/photos/articles/Nature/A-G/bat-myths-silo.jpg.adapt.945.1.jpg\')\"><b>Bat</b></td><td onclick=\"fucn(\'http://pestworldforkids.org/media/18850/Roof-Rat_iStock_000005484522Large5B15D.jpg\')\"><b>Rat</b></td></tr>
</table>
</div>
<div float=\"left\">
<img id=\"app\" src=\"sdsd.png\" hieght=\"150\" width=\"150\">
</div>
<div id=\"time\">
</div>
</center>
</body>
Solution
Find the solution below:
==========================================================================
<html>
<head>
<script type=\"text/javascript\">
<!-- method to perform action -->
click=0;
function func(link)
{
document.getElementById(\"app\").src=link;
click++;
if(click>1)
<!-- clearing timer -->
clearTimeout(timer);
onTimer();
}
i=60;
<!-- setting timer -->
function onTimer() {
document.getElementById(\'time\').innerHTML = i;
i--;
if (i < 0) {
alert(\"Time out Kid\");
}
else {
timer= setTimeout(onTimer, 1000);
}
}
function checkMatch()
{
var m=new String(document.getElementById(\'textMatch\').value).toUpperCase();
var str=new String(document.getElementById(\"app\").src);
if(i>0&&str.search(\"bat\")>0 && m ==\"BAT\"){
alert(\"typed correctly\");
}
if(i>0&&str.search(\"cat\")>0 && m ==\"CAT\"){
alert(\"typed correctly\");
}
if(i>0&&str.search(\"rat\")>0 && m ==\"RAT\"){
alert(\"typed correctly\");
}
if(i>0&&str.search(\"apple\")>0 && m ==\"APPLE\"){
alert(\"typed correctly\");
}
clearTimeout(timer);
}
</script>
</head>
<body>
<center>
<!-- just a heading of game -->
<h1 style=\"color:blue;\">Lets Play The Game </h1>
<div float=\"left\">
<!-- table with words -->
<table border=\"3\" hieght=\"200\" width=\"300\">
<tr><td onclick=\"func(\'http://www.remediitraditionale.ro/wp-content/uploads/2016/01/apple-250x250.png\')\"><b>Apple</b></td><td onclick=\"func(\'http://img00.deviantart.net/f51e/i/2012/171/0/f/png_cat_by_eross_666-d5457c8.png\')\"><b>Cat</b></td></tr>
<tr><td onclick=\"func(\'http://kids.nationalgeographic.com/content/dam/kids/photos/articles/Nature/A-G/bat-myths-silo.jpg.adapt.945.1.jpg\')\"><b>Bat</b></td><td onclick=\"func(\'http://pestworldforkids.org/media/18850/Roof-rat_iStock_000005484522Large5B15D.jpg\')\"><b>Rat</b></td></tr>
</table>
</div>
<div float=\"left\">
<img id=\"app\" src=\"sdsd.png\" hieght=\"150\" width=\"150\">
</div>
<div id=\"time\">
</div>
<input type=\"text\" id=\"textMatch\" onkeyup=\"checkMatch();\"
</center>
</body>
============================================================================
please let me know if you need more implementation.
