Posts Tagged ‘ html ’

A Simple game with Javascript


Copy the following codes, paste it in the notepad. After that save it anywhere you want with the name “bounce.html”.

Actually you can give any name following by the .html extension. And then open the file.

If permission is asked by the browser to allow the ActiveX control or not, press allow. Its ok. 🙂

For the programmers, I’ve only used simple codes in html and javascripts. It is easier to understand what each line does. Others might be a bit confusing but is not so complex. I love using counters.

Its a simplest game ever. Might be frustrating.

ENJOY!

CODES:

<html>
<head></head><title>From leargramming.wordpress.com</title>
<body>
<form name=”form1″>
<script language=”javascript”>
var e=new Array();
for (i=0;i<=100;i++)
{
e[i]=new Array(2);
e[i][0]=1;
e[i][1]=1;
}
r=1;
count=0;
maxx=screen.availWidth/3;
maxy=screen.availHeight/4;
damnit=0;
function delay()
{
damnit=setTimeout(‘delay()’,1000);
ioioi=document.getElementById(‘timerw’).value;
ioioi=parseInt(ioioi);
if (count!=0 && (ioioi>=1 && ioioi!=”NaN”) && ioioi!=0)
document.getElementById(‘timerw’).value=ioioi-1+””;
}

function countit()
{
if (document.getElementById(‘timerw’).value!=”0″)
count++;
ti=” times”;
if (count==1)
ti=” time”;
document.getElementById(‘coun’).value=count+ti;
}
function bounce(l,too)
{

if (document.getElementById(‘timerw’).value==”0″)
{
too=5;
document.getElementById(‘timerw’).disabled;
clearTimeout(damnit);
}
ido=”n”+l;
document.getElementById(ido).style.visibility=”visible”;
l=parseInt(l);
y=document.getElementById(ido).style.top;
x=document.getElementById(ido).style.left;
y=parseInt(y);
x=parseInt(x);

if(y<=0) {
e[l][0]=1;
}
if(y>maxy) {
e[l][0]=-1;
}
y=e[l][0]+y;
document.getElementById(ido).style.top=y+0;

if(x<=0) {
e[l][1]=1;
}
if(x>maxx) {
e[l][1]=-1;
}
x=e[l][1]+x;
document.getElementById(ido).style.left=x+0;
if (too==1);
qqq=setTimeout(“bounce(“+l+”,”+too+”)”,200);
}
</script>
<body onload=”delay()”>
<div style=”position:absolute; top:15; left:60; visibility:’hidden'” id=”n1″ onclick=”countit()”>
<input type=”button” value=”Click me” onclick=”bounce(1,1)”>
</div>
<input type=”text” value=”0 clicks” id=”coun” disabled><br>
Set Timer: <input type=”text” value=”60″ id=”timerw”>: seconds<br>
<br><br>
Click as many times as you can.<br>
Refresh page to replay.
</form>
</body>
</html>