Pages

Friday, May 20, 2011

Change Image on Mouseover Javascript


This is a small javascript that changes an image on mouseover. Run your mouse on the image above to see the rollover effect. The image contains a link and is a great script for any webpage.
The mouseover script is also useful for those learning javascript. Have a look at the code and see how easy it is to follow.
Works with most browsers, IE 4 and above. Not with netscape.
Installation:
STEP 1.
Make 2 images which you would like to display. You can name them #1 and #2 if you wish and they can be jpg or gif format. Upload the images to your server.
STEP 2
Copy the code below and paste this between the <head> and </head> tags of your html document. Point the script to where the images reside on your webhost. By this I mean change image source lines:
image1.src = 'images/rollover1.jpg' and
image2.src='images/rollover2.jpg'

The lines in red should show where your images are stored and your image name. The example shows that my images are stored in the images folder and the names are rollover1.jpg and rollover2.jpg. You may need to use your full url such as http://wwww.yoursite.com/image1.jpg
<script language="Javascript">
if (document.images)
{ image1 = new Image image2 = new Image image1.src = 'images/rollover1.jpg' image2.src
= 'images/rollover2.jpg' } </script>
STEP 3.
Copy the code below and paste this into the body of your html document, where you want the images to appear on your webpage.
Again change the image source to suit at this line; img src="images/rollover1.jpg"
(Note that you only need to change the image1 here. The second image is called by the script.)

<a href="http://www.siivananda.com"
onMouseOver="document.rollover.src=image2.src" onMouseOut="document.rollover.src=image1.src">
<img src="images/rollover1.jpg" border=0 name="rollover"></a>

That's it. Good luck.

Site Update Javascript with Slideshow Effect


Tell your visitors what's new or give updates to your site with this great space saving message slideshow javascript. A description of each new or updated page is delivered within the text area for a given amount of time.
Could be used not only for website updates but many other uses, such as affiliate links, link rotation, the possibilities are endless.
The update message script provides a button so that visitors can visit the link to each message. Very easy to install and configure. Just add your messages and links. Can hold countless number of messages.
Installation
Copy and paste the code below between the <body> and </body> tags of your html document where you want the text box to appear on your webpage. Simply replace the messages and links with your own. All instructions for messages and links are contained within the script
<table
border="0" cellspacing="0" cellpadding="0"> <tr>
<td width="100%"> <form name="slideshow"> <div
align="center"> <center> <p><b><font color="#0000CC">What's
New at Hypergurl!</font></b><br> <textarea rows="5"
name="S1" cols="40" wrap="virtual"></textarea>
<br> <input type="button" value="Click Here!" name="B1"
onClick="window.location=messagelinks[curmsg]"> </p> </center>
</div> </form> </td> </tr> </table> </div>
<div align="center">
<script>
 var curmsg=-1 var messages=new Array()
messages[0]="Message 1 here! very eye catching. Grab the code now!"
messages[1]="Message 2 here! Read our article on link popularity!" messages[2]="message
3 here! Disable right click and protect your source code!" //add more messages
as desired var messagelinks=new Array() messagelinks[0]="http://www.yoursite.com"
messagelinks[1]="http://www.yoursite.com" messagelinks[2]="http://www.yoursite.com"
//add more links as indicated by the number of messages function slidemessage(){
if (curmsg<messages.length-1) curmsg++ else curmsg=0 document.slideshow[0].value=messages[curmsg]
setTimeout("slidemessage()",4500) } slidemessage() </script> </div>
Enjoy!

Online Typing Test Javascript


This is a great javascript that will make your sites stickability even better. The online typing test will keep your visitors at your site longer and have them coming back for more. Easy 2 step installation and what's even better, there's nothing at all to change in the scripts.
Why not take the online typing test yourself and see how good your typing skills are?
STEP 1     
Copy and paste the script below into the head of your html document.

<SCRIPT LANGUAGE="JavaScript">
msg = new Array("Practicing
with your typing can greatly help your overall computer skills.", "A
new computer is sold in the US every hour!", "When do birds migrate
from North to South?", "Perplexing phrases, like this one, are tougher
to type.") word = 10 function m() { msg = new Array("Practicing with
your typing can greatly help your overall computer skills.", "A new
computer is sold in the US every hour!", "When do birds migrate from
North to South?", "Perplexing phrases, like this one, are tough to type.")
word = 10 } function e() { msg = new Array("If you can correctly, and quickly,
type this perplexing sentence, you are one superb typist!", "You are
one superb typist if you can correctly, and quickly, type this long phrase.",
"I believe you're a good typist, so I believe you will correctly copy this
statement!", "Because this is not a fairly simple phrase, could you
swiftly, and precisely, copy it?") word = 15 } function s() { msg = new Array("Computers
are the medium of the future.", "Can you type this phrase rather quickly?",
"Who is the President of the US?", "I believe that you can type
well!") word = 7 } function beginIt() { randNum = Math.floor((Math.random()
* 10)) % 4 msgType = msg[randNum] day = new Date(); startType = day.getTime();
document.theForm.given.value = msgType document.theForm.typed.focus(); document.theForm.typed.select();
} function cheat() { alert("You can not change that!"); document.theForm.typed.focus();
} function stopIt() { dayTwo = new Date(); endType = dayTwo.getTime(); totalTime
= ((endType - startType) / 1000) spd = Math.round((word/totalTime) * 60) if (document.theForm.typed.value
== document.theForm.given.value) { alert("\nYou typed a " + word + "
word sentence in " + totalTime + " seconds, a speed of about "
+ spd + " words per minute!") } else { alert("You made an error,
but typed at a speed of " + spd + " words per minute.") } } //
End --> </SCRIPT>
STEP 2
Copy and paste the script below where you want the online typing test to appear on your webpage.
<CENTER>
<FORM name="theForm"> <TABLE BORDER=3 CELLSPACING=0 CELLPADDING=0>
<TR> <TD>Are you a....</TD> <TD align=center><input
type=radio name="sme" value="Beginner" onClick="s()"
checked>Beginner <input type=radio name="sme" value="Novice"
onClick="m()">Novice <input type=radio name="sme" value="Expert"
onClick="e()">Expert</TD> </TR> <TR><TD colspan=2><BR>
<center><input type=button value="Start Typing Test" name="start"
onClick="beginIt()"></center><P> <textarea name="given"
cols=53 rows=3 wrap=on onFocus="cheat()"></textarea></TD>
</TR> <TR><TD colspan=2><center><input type=text name="typed"
size=45> <input type=button value="DONE" name="stop"
onClick="stopIt()"></center></TD> </TR> </TABLE></FORM>
</CENTER>

That's it! Good typing!

Underwater Bubbles Cursor


This trailing cursor javascript effect looks to be underwater with bubble images rising from the mouse cursor to the top of the screen. The underwater bubble script is more effective on webpages with a lighter background.
The underwater bubbles cursor is easy to install. Follow the simple instructions below.
STEP 1
Right click on this bubble image. http://www.hypergurl.com/bluebub.gifSave the bubble image to your hard drive and upload this to your server. Place the bubble image into the same folder as your html page.

STEP 2

Copy the javascript code below and paste this on the line below the <body> tag of your html document. There is nothing at all to change within the code.
<script
language="JavaScript">
n4=(document.layers);
n6=(document.getElementById&&!document.all); ie=(document.all); o6=(navigator.appName.indexOf("Opera")
!= -1)?true:false; img0=new Image(); img0.src="bluebub.gif"; num=(n6)?10:15;
y=0; x=0; if (n4||n6){ window.captureEvents(Event.MOUSEMOVE); function mouse1(e){
y = e.pageY-20-window.pageYOffset; x = e.pageX-4; } if (n4) window.onMouseMove=mouse1;
else document.onmousemove=mouse1; } if (ie||o6){ function mouse2(){ y = (ie)?event.clientY-20:event.clientY-20-window.pageYOffset;
x = event.clientX-4; } document.onmousemove=mouse2; } yp=new Array(); xp=new Array();
sp=new Array(); rt=new Array(); gr=new Array(); s1=new Array(); s2=new Array();
nz=new Array(); wh=(ie)?window.document.body.clientHeight:window.innerHeight;
for (i=0; i < num; i++){ yp[i]=Math.random()*wh-y; xp[i]=x; sp[i]= 6+Math.random()*3;
s1[i]=0; s2[i]=Math.random()*0.1+0.05; gr[i]=4; nz[i]=Math.random()*15+5; rt[i]=Math.random()*0.5+0.1;
} if (n4){ for (i=0; i < num; i++){ document.write("<LAYER NAME='bub"+i+"'
LEFT=0 TOP=-50>" +"<img src='bluebub.gif' width="+nz[i]+"
height="+nz[i]+"></LAYER>"); } } if (ie){ document.write('<div
style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < num; i++){ document.write('<img id="bub'+i+'" src="'+img0.src+'"
style="position:absolute;top:-50px;left:0px">'); } document.write('</div></div>');
} if (n6||o6){ for (i=0; i < num; i++){ document.write("<div id='bub"+i+"'
style='position:absolute;top:-50px;left:0px'>" +"<img src="+img0.src+"
width="+nz[i]+" height="+nz[i]+"></div>"); }
} function MouseBubbles(){ scy=(document.all)?document.body.scrollTop:window.pageYOffset;
scx=(document.all)?document.body.scrollLeft:window.pageXOffset; for (i=0; i <
num; i++){ sy = sp[i]*Math.sin(270*Math.PI/180); sx = sp[i]*Math.cos(s1[i]*5);
yp[i]+=sy; xp[i]+=sx; if (yp[i] < -40){ yp[i]=y; xp[i]=x; sp[i]= 6+Math.random()*3;
gr[i]=4; nz[i]=Math.random()*15+5; } if (n4){ document.layers["bub"+i].left=xp[i]+scx;
document.layers["bub"+i].top=yp[i]+scy; } if (ie){ document.getElementById("bub"+i).style.left=xp[i]+scx;
document.getElementById("bub"+i).style.top=yp[i]+scy; document.getElementById("bub"+i).style.width=gr[i];
document.getElementById("bub"+i).style.height=gr[i]; } if (n6||o6){
document.getElementById("bub"+i).style.left=xp[i]+scx; document.getElementById("bub"+i).style.top=yp[i]+scy;
} gr[i]+=rt[i]; s1[i]+=s2[i]; if (gr[i] > 14) gr[i]=15; } setTimeout('MouseBubbles()',10);
} MouseBubbles(); //--> </script>

That's it!

Hit the Dots Javascript Game


Great online javascript game for your website. Hit the Dots is played by clicking as many dots that are randomly generated by the computer. Your scrore is recorded so you can try again and beat your best.
Warning ! This online game is very addictive. Your visitors might never leave.
Grab the code now!


STEP 1
Copy the code below and place this into the <head> of your html document.
<SCRIPT LANGUAGE="JavaScript">
 gamelength=30; timerID=null var playing=false; var numholes=6*10;
var currentpos=-1; function clrholes() { for(var k=0;k<document.dmz.elements.length;k++)
document.dmz.elements[k].checked=false; } function stoptimer() { if(playing) clearTimeout(timerID);
} function showtime(remtime) { document.cpanel.timeleft.value=remtime; if(playing)
{ if(remtime==0) { stopgame(); return; } else { temp=remtime-1; timerID=setTimeout("showtime(temp)",1000);
} } } function stopgame() { stoptimer(); playing=false; document.cpanel.timeleft.value=0;
clrholes(); display("Game Over"); alert('Game Over.\nYour score is:
'+totalhits); } function play() { stoptimer(); if(playing) { stopgame(); return;
} playing=true; clrholes(); totalhits=0; document.cpanel.score.value=totalhits;
display("Playing"); launch(); showtime(gamelength); } function display(msg)
{ document.cpanel.state.value=msg; } function launch() { var launched=false; while(!launched)
{ mynum=random(); if(mynum!=currentpos) { document.dmz.elements[mynum].checked=true;
currentpos=mynum; launched=true; } } } function hithead(id) { if(playing==false)
{ clrholes(); display("Push Start to Play"); return; } if(currentpos!=id)
{ totalhits+=-1; document.cpanel.score.value=totalhits; document.dmz.elements[id].checked=false;
} else { totalhits+=1; document.cpanel.score.value=totalhits; launch(); document.dmz.elements[id].checked=false;
} } function random() { return(Math.floor(Math.random()*100%numholes)); } // End
--> </script>
STEP 2
Copy the code below and paste this between the <body> and </body> tags of your html document, where you want the game to appear on your webpage.
<center><h4>Hit-the-Dot</h4></center>
<center>Test your skill. How many boxes can you check in 30 seconds?</center>
<form name="cpanel"> <center> <table cellspacing=3>
<tr> <td><input type="button" name="startstop"
value=" Start Game | Stop Game " onClick="play()"></td>
<td><pre> </pre></td> <td align=right>Time:</td>
<td><input type="text" name="timeleft" size="4"
onFocus="this.blur()"></td> </tr> <tr> <td><input
type="text" name="state" size="20" value="Push
Start to Play" onFocus="this.blur()"></td> <td><pre>
</pre></td> <td align=right>Score:</td> <td><input
type="text" name="score" size="4" onFocus="this.blur()"></td>
</tr> </table> </center> </form> <form name="dmz">
<center> <table cellspacing=3> <tr> <td colspan=10><hr
size=1></td> </tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(0)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(1)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(2)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(3)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(4)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(5)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(6)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(7)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(8)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(9)"></td>
</tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(10)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(11)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(12)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(13)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(14)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(15)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(16)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(17)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(18)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(19)"></td>
</tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(20)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(21)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(22)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(23)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(24)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(25)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(26)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(27)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(28)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(29)"></td>
</tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(30)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(31)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(32)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(33)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(34)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(35)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(36)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(37)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(38)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(39)"></td>
</tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(40)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(41)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(42)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(43)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(44)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(45)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(46)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(47)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(48)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(49)"></td>
</tr> <tr> <td align="center" valign="center"><input
type="radio" onClick="hithead(50)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(51)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(52)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(53)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(54)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(55)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(56)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(57)"></td>
<td align="center" valign="center"><input type="radio"
onClick="hithead(58)"></td> <td align="center"
valign="center"><input type="radio" onClick="hithead(59)"></td>
</tr> <tr><td colspan=10><hr size=1></td> </tr></table></center></form>
<center><table cellspacing=3><tr><td> <p><strong>Instructions:</strong>
<ol><li>Click on the radio buttons as<BR> they are selected
randomly by the computer.<BR> <li>1 point per hit, minus 1 point per
miss.<BR> </ol></td></tr></table></center>

Expanding images javascript


Here's a great way to display your images in thumbnails and enlarge them on the page on mouseover.
Simply make your images around 170 pixels by 125 pixels and the script will do the rest. In the example above we have used 5 images, yet with a little manipulation of the script you could add more or less if desired.
You will need to position the description layer to suit your page, more details below.
Installation:
Step 1
Copy and paste the code below into the head of your html document. Nothing to configure in this part.
<script language="JavaScript">
function resizeImage(e) { if (document.layers) { //Netscape var xMousePos = e.pageX; var
xMousePosMax = window.innerWidth+window.pageXOffset; } else if (document.all)
{ // IE var xMousePos = window.event.x+document.body.scrollLeft; } else if (document.getElementById)
{//Netscape var xMousePos = e.pageX; var xMousePosMax = window.innerWidth+window.pageXOffset;
} var i = (-1 * (((xMousePos/340) - (250/340)) * ((xMousePos/340) - (250/340))))
+ 1; if (i < .4) i = .4; if (i > 2) i = 2; picture1.width=(170 * i); picture1.height=(125
* i); i = (-1 * (((xMousePos/340) - (420/340)) * ((xMousePos/340) - (420/340))))
+ 1; if (i < .4) i = .4; if (i > 2) i = 2; picture2.width=(170 * i); picture2.height=(125
* i); i = (-1 * (((xMousePos/340) - (525/340)) * ((xMousePos/340) - (525/340))))
+ 1; if (i < .4) i = .4; if (i > 2) i = 2; picture3.width=(170 * i); picture3.height=(125
* i); i = (-1 * (((xMousePos/340) - (600/340)) * ((xMousePos/340) - (600/340))))
+ 1; if (i < .4) i = .4; if (i > 2) i = 2; picture4.width=(170 * i); picture4.height=(125
* i); i = (-1 * (((xMousePos/340) - (680/340)) * ((xMousePos/340) - (680/340))))
+ 1; if (i < .4) i = .4; if (i > 2) i = 2; picture5.width=(170 * i); picture5.height=(125
* i); } function output(message) { obj = eval("text"); obj.innerHTML
= "<font size=\"6\">"+message+"</font>";
} function handleMouse() { if (document.layers) { // Netscape document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = resizeImage; } else if (document.all) { // Internet Explorer
document.onmousemove = resizeImage; } else if (document.getElementById) { // Netcsape
6 document.onmousemove = resizeImage; } } function doNothing(e) { var i = 0.4;
picture1.width=(170 * i); picture1.height=(125 * i); picture2.width=(170 * i);
picture2.height=(125 * i); picture3.width=(170 * i); picture3.height=(125 * i);
picture4.width=(170 * i); picture4.height=(125 * i); picture5.width=(170 * i);
picture5.height=(125 * i); } function ignoreMouse() { if (document.layers) { //
Netscape document.captureEvents(Event.MOUSEMOVE); document.onmousemove = doNothing;
} else if (document.all) { // Internet Explorer document.onmousemove = doNothing;
} else if (document.getElementById) { // Netcsape 6 document.onmousemove = doNothing;
} } //--> </script>

Step 2
Copy and paste the code below into your html where you want the images to appear on your page. Change the links within to your own and the image src to reflect the images that you use.
<table
width="100%" border="0" cellspacing="0" cellpadding="0">
<tr> <td colspan="4" onMouseOver="ignoreMouse()"></td>
</tr> <tr> <td width="8" height="140" valign="bottom"
onMouseOver="ignoreMouse()"> </td> <td width="142"
valign="bottom" onMouseOver="handleMouse()"></td>
<td width="889" valign="bottom" onMouseOver="handleMouse()"><nobr>
<a href="http://www.hypergurl.com" target="_blank"><img
name="picture1" src="image1.gif" width="68" height="50"onMouseOver="output('Palm
Tree')" onMouseOut='output("")' border="0"></a>
<a href="http://www.hypergurl.com/hosting.html" target="_blank"><img
name="picture2" src="image2.gif" width="68" height="50"
onMouseOver="output('Family')" onMouseOut='output("")' border="0"></a>
<a href="http://www.hypergurl.com" target="_blank"><img
name="picture3" src="image3.gif" width="68" height="50"onMouseOver="output('Family
1')" onMouseOut='output("")' border="0"></a>
<a href="http://www.hypergurl.com" target="_blank"><img
name="picture4" src="image4.gif" width="68" height="50"onMouseOver="output('Menu
Option 4')" onMouseOut='output("")' border="0"></a>
<a href="http://www.hypergurl.com" target="_blank"><img
name="picture5" src="image5.gif" width="68" height="50"onMouseOver="output('Menu
Option 5')" onMouseOut='output("")' border="0"></a>
</nobr></td> <td width="3" valign="bottom"
onMouseOver="ignoreMouse()">&nbsp;</td> </tr> <tr>
<td height="10" colspan="4" onMouseOver="ignoreMouse()"></td>
</tr> </table>
Step 3
Copy the code below and paste this below step 2 within your html source. Change the left and top pixel figures to suit the position of the text description on your page layout.

<div
id="text" name="text" style="position:absolute; left:166px;
top:527px; width:665px; height:94px; z-index:1" onMouseOver="ignoreMouse()"></div>

Calculate the Day You Were Born.


This simple day born javascript calculates the day you were born from the date that you supply. Very useful script which is easy to install. 2 step copy and paste installation with nothing at all to alter.
STEP 1
Copy and paste the script below and place this into the <head> of your html document.
<SCRIPT LANGUAGE="JavaScript">
function calculate() { month = document.form.month.selectedIndex; month = document.form.month.options[month].value;
day = document.form.day.selectedIndex; day = document.form.day.options[day].value;
year = document.form.year.value; var oyear=year var dob = " "+ year
+", "+month + ", "+day; var thenx = new Date(dob); var year=thenx.getYear();
if (year<100) year="19" + thenx.getYear(); else year=thenx.getYear();
if (year > 1969) wyear=year; else { if (oyear<1900) { if (oyear>1800)
{ wrelyear= (eval(oyear)-1801)%(28); wyear = wrelyear+1981; } else wyear = 1970
} else if (oyear>1900) {wrelyear= (eval(oyear)-1901)%(28); wyear= wrelyear+1985
} else if (oyear==1900) {wyear= 1990; } } var dob = " "+ wyear +",
"+month + ", "+day; var thenx = new Date(dob); var theday = thenx.getDay()+1;
var date=thenx.getDate(); var weekday = new Array(6); weekday[1]="Sunday";
weekday[2]="Monday"; weekday[3]="Tuesday"; weekday[4]="Wednesday";
weekday[5]="Thursday"; weekday[6]="Friday"; weekday[7]="Saturday";
if (day != date) alert("Sorry! That appears to be an invalid date!"+day+"
..."+date+"::"+oyear+"..."+year+" "+dob+"=="+wyear+".-.-"+thenx+"
"+day+" "+month); else { dayborn = weekday[theday]; dob = dayborn
+ ", " + month + " " + date + ", " + oyear + ".";
alert("You were born on " + dob); } } // End --> </script>

STEP 2
Copy and paste the script below and place this into the <body> of your html document where you want the form to appear.
<form
name=form> <center> <table border=2 cellspacing=0 cellpadding=0 bgcolor=white>
<tr><td colspan=3 align=center><font face="verdana, arial"
size="-1">When were you born?</font></td></tr>
<tr><td align=center> <select name="month"> <option
value="" selected>Month <option value="January">Jan
<option value="February">Feb <option value="March">Mar
<option value="April">Apr <option value="May">May
<option value="June">Jun <option value="July">Jul
<option value="August">Aug <option value="September">Sep
<option value="October">Oct <option value="November">Nov
<option value="December">Dec </select> </td> <td
align=center> <select name="day"> <option value=""
selected>Day <option value="1">01 <option value="2">02
<option value="3">03 <option value="4">04 <option
value="5">05 <option value="6">06 <option value="7">07
<option value="8">08 <option value="9">09 <option
value="10">10 <option value="11">11 <option value="12">12
<option value="13">13 <option value="14">14 <option
value="15">15 <option value="16">16 <option value="17">17
<option value="18">18 <option value="19">19 <option
value="20">20 <option value="21">21 <option value="22">22
<option value="23">23 <option value="24">24 <option
value="25">25 <option value="26">26 <option value="27">27
<option value="28">28 <option value="29">29 <option
value="30">30 <option value="31">31 </select>
</td> <td align=center> <input type=text name=year value="19"
size=4 maxlength=4> </td></tr> </table><p> <input
type=button value="Calculate" onClick="calculate()"> </center>
</form>

That's It! enjoy!

Trailing clock cursor java script.


WOW!
Here is one of the best mouse clock cursor javascripts that I have yet seen. Just allow your mouse cursor to remain idle for a few seconds and you will see a clock telling the day, date and time and the hands actually move, just like a real clock. The time is called from the viewing computer.
Simply copy and paste the script between the <body> and </body> tags of your html page.
(To put the clock cursor code in Xanga, go to "Look and Feel" in your site.(located in your module) then paste the code into the space that says "Input your own Header HTML" or "Your HTML".)
There is nothing within the script to alter, if you do change anything at all it will change the co-ordinates and render the script inoperable. I will not help anyone who has tampered with the script in any way to make it work on their page.
You can change the color to suit the background of your page, if you wish, in the top section of the script . Just use the hex color number without the hash sign.

This is not only fun but is very useful. As always, if you have any trouble installing this or any other script on my site, don't hesitate to email me. I"ll be glad to help you.

This script works on webpages only and cannot be installed to desktops.


<SCRIPT
language=JavaScript> //Alter nothing below! Alignments will be lost!
dCol='000000';//date colour.
fCol='000000';//face colour.
sCol='000000';//seconds colour.
 mCol='000000';//minutes colour.
hCol='000000';//hours colour.
ClockHeight=40; ClockWidth=40; ClockFromMouseY=0; ClockFromMouseX=100;
d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY");
m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER");
date=new Date(); day=date.getDate(); year=date.getYear(); if (year < 2000)
year=year+1900; TodaysDate=" "+d[date.getDay()]+" "+day+"
"+m[date.getMonth()]+" "+year; D=TodaysDate.split(''); H='...';
H=H.split(''); M='....'; M=M.split(''); S='.....'; S=S.split(''); Face='1 2 3
4 5 6 7 8 9 10 11 12'; font='Arial'; size=1; speed=0.6; ns=(document.layers);
ie=(document.all); Face=Face.split(' '); n=Face.length; a=size*10; ymouse=0; xmouse=0;
scrll=0; props="<font face="+font+" size="+size+"
color="+fCol+"><B>"; props2="<font face="+font+"
size="+size+" color="+dCol+"><B>"; Split=360/n;
Dsplit=360/D.length; HandHeight=ClockHeight/4.5 HandWidth=ClockWidth/4.5 HandY=-7;
HandX=-2.5; scrll=0; step=0.06; currStep=0; y=new Array();x=new Array();Y=new
Array();X=new Array(); for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0} Dy=new
Array();Dx=new Array();DY=new Array();DX=new Array(); for (i=0; i < D.length;
i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0} if (ns){ for (i=0; i < D.length; i++)
document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+'
width='+a+'><center>'+props2+D[i]+'</font></center></layer>');
for (i=0; i < n; i++) document.write('<layer name="nsFace'+i+'"
top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');
for (i=0; i < S.length; i++) document.write('<layer name=nsSeconds'+i+'
top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');
for (i=0; i < M.length; i++) document.write('<layer name=nsMinutes'+i+'
top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');
for (i=0; i < H.length; i++) document.write('<layer name=nsHours'+i+' top=0
left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');
} if (ie){ document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div
style="position:relative">'); for (i=0; i < D.length; i++) document.write('<div
id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');
document.write('</div></div>'); document.write('<div id="Of"
style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++) document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');
document.write('</div></div>'); document.write('<div id="Oh"
style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++) document.write('<div id="ieHours"
style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');
document.write('</div></div>'); document.write('<div id="Om"
style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++) document.write('<div id="ieMinutes"
style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');
document.write('</div></div>') document.write('<div id="Os"
style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++) document.write('<div id="ieSeconds"
style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');
document.write('</div></div>') } (ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){ ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;
xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX; } (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
function ClockAndAssign(){ time = new Date (); secs = time.getSeconds(); sec =
-1.57 + Math.PI * secs/30; mins = time.getMinutes(); min = -1.57 + Math.PI * mins/30;
hr = time.getHours(); hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;
if (ie){ Od.style.top=window.document.body.scrollTop; Of.style.top=window.document.body.scrollTop;
Oh.style.top=window.document.body.scrollTop; Om.style.top=window.document.body.scrollTop;
Os.style.top=window.document.body.scrollTop; } for (i=0; i < n; i++){ var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;
F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll; F.left=x[i]
+ ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180); } for (i=0; i < H.length;
i++){ var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style; HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;
HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs); } for (i=0; i < M.length; i++){
var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style; ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;
ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min); } for (i=0; i < S.length; i++){
var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style; SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;
SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec); } for (i=0; i < D.length; i++){
var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style; DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;
DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180); } currStep-=step;
} function Delay(){ scrll=(ns)?window.pageYOffset:0; Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);
Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed); for (i=1; i < D.length; i++){
Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed); Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);
} y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed); x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (i=1; i < n; i++){ y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed); x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
} ClockAndAssign(); setTimeout('Delay()',20); } if (ns||ie)window.onload=Delay;
// end the hiding comment --> </SCRIPT>

Online EyeQ Test


Having online games on your site add to your visitors pleasure and tempt them to come back time and again. This simple to configure online javascript game will surely increase your traffic.
Is your EyeQ is as high as Einstein's IQ. Play EyeQ online or download it for free. Copy-paste installation. IE 5 or higher.
Step 1: Paste the following code below the <body> tag of your webpage
<script>
// set horizontal distance to the left margin of browser window (pixels)
 var gameleft=0;
// set vertical distance to the left margin of browser window (pixels)
 var gametop=10; </script> <script
src="eyeqdown.js"></script>
Step 2: Go to the top of the script code and configure the position of EyeQ.
Step 3: Download the zip file 'eyeq.zip'. Extract it and place all the files into the same folder as your webpage. Or copy past the code from below
var floatingspeed=2
var trynumbernew=0
var trynumberold=0
var skinwidth=228
var skinheight=150
var tempo=20
var guessmodus=false
var timer
var timetimer
var timerwrong
var timmercorrect
var timerstart
var timecolor="000000"
var gamemaxseconds=30
var stopit=false
var starttime
var nowtime=0
var penalty=0
var penaltyseconds=1
var dotsmax=16
var dotsrandom=5
var correctdots=dotsrandom+1
var correctanswers=0
var stepx=new Array()
var stepy=new Array()
for (i=0;i<=dotsmax;i++) {
            stepx[i]=randomspeed(floatingspeed)
            stepy[i]=randomspeed(floatingspeed)
}
var marginleft=37
var marginright=109
var margintop=50
var marginbottom=105

var spancontent=new Array()
var imgpreload=new Image
imgpreload.src="dot.gif"

for (i=0;i<=dotsmax;i++) {
            spancontent[i]="<img src='dot.gif'>"
}

function positiongame() {
            if (document.all) {
                        document.all.roof.style.posLeft=gameleft
                        document.all.roof.style.posTop=gametop
                        document.all.quickeyeskin.style.visibility="visible"
            }
}

function guess(thisno) {
            if (nowtime<gamemaxseconds && guessmodus) {
                        guessmodus=false
                        if (thisno==correctdots) {          
                                    correctanswers++
                                    var resultbarwidth=correctanswers*4
                                    resultbar.innerHTML="<table border=0 cellpadding=0 cellspacing=0><tr valign=top><td align=left><img src=\"transparent.gif\" width="+resultbarwidth+" height=5></td></tr></table>"
                                    resultboard.innerHTML="<table width=80 height=62 border=0 cellpadding=2 cellspacing=0 bgcolor=green><tr valign=middle><td align=center><font face=Arial size=1 color=white>CORRECT</font></td></tr></table>"
                                    document.all.resultboard.style.visibility="visible"
                                    trynumberold=trynumbernew
                                    clearTimeout(timerwrong)
                                    timercorrect=setTimeout("nextguess()",500)
                        }
                        else {
                                    penaltyseconds++
                                    resultboard.innerHTML="<table width=80 height=62 border=0 cellpadding=2 cellspacing=0 bgcolor=red><tr valign=middle><td align=center><font face=Arial size=1 color=white>WRONG.<br>Correct: "+correctdots+"<br>Penalty: "+penaltyseconds+" sec.</font></td></tr></table>"
                                    document.all.resultboard.style.visibility="visible"
                                    penalty=(penaltyseconds*1000)
                                    trynumberold=trynumbernew
                                    timerwrong=setTimeout("nextguess()",penalty)
                        }
            }
}

function startgame() {
            trynumbernew++
            stopit=false
            guessmodus=true
            timecolor="000000"
            hideresultboard()
    startnewtime()
            setdots()
}

function stopgame() {
            clearTimeout(timerstart)
            stopit=true
            penalty=1
            resultbar.innerHTML=""
            resultboard.innerHTML="<table width=80 height=62 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=black><font face=Arial size=1 color=white>New game</font></td></tr></table>"
            document.all.resultboard.style.visibility="visible"
            timesign.innerHTML="<font size=1 face=Arial color=black>30.00</font>"
            document.all.timesign.style.visibility="visible"
            guessmodus=false
            nowtime=0
            penaltyseconds=1
            correctanswers=0
            timerstart=setTimeout("startgame()",800)
}

function nextguess() {
            if (nowtime<gamemaxseconds && trynumbernew==trynumberold) {
                        guessmodus=true
                        hideresultboard()
                        setdots()
            }
}

function hideresultboard() {
            document.all.resultboard.style.visibility="hidden"
}

function startnewtime() {
            starttime= new Date()
            starttime=starttime.getTime()
    checktime()
}

function setdots() {
            dotsrandom=randommaker(dotsmax)
            correctdots=dotsrandom+1
                        for (i=0;i<=dotsmax;i++) {            
                                    var thisspan = eval("document.all.d"+(i)+".style")
                                    thisspan.visibility="hidden"
                        }
                        for (i=0;i<=dotsrandom;i++) {            
                                    var thisspan = eval("document.all.d"+i)
                                    thisspan.innerHTML=spancontent[i]
                                    var thisspan = eval("document.all.d"+(i)+".style")
                                    var randomposleft=marginright-marginleft
                                    var randompostop=marginbottom-margintop
                                    thisspan.posLeft=randommaker(randomposleft)+marginleft
                                    thisspan.posTop=randommaker(randompostop)+margintop
                                    thisspan.visibility="visible"
                        }
                        checkmovement()
}

function randomspeed(range) {             
            rand=Math.floor(range*Math.random())
            if (rand==0) {rand=Math.ceil(range/2)}
    return rand
}

function randommaker(range) {              
            var randomposition=Math.floor(range*Math.random())
    return randomposition
}

function checkmovement() {
            if (document.all && guessmodus && nowtime<gamemaxseconds  && stopit==false) {
                        checkposition()
                        movepictures()
            timer=setTimeout("checkmovement()",tempo)
            }
            else {
                        clearTimeout(timer)
                        for (i=0;i<=dotsmax;i++) {            
                                    var thisspan = eval("document.all.d"+(i)+".style")
                                    thisspan.visibility="hidden"
                                    thisspan.posLeft=marginleft
                                    thisspan.posTop=margintop
                        }
            }
}

function movepictures() {
            for (i=0;i<=dotsrandom;i++) { 
            var thisspan=eval("document.all.d"+(i)+".style")
            thisspan.posLeft+=stepx[i]
                        thisspan.posTop+=stepy[i]
    }
}

function checkposition() {
            for (i=0;i<=dotsrandom;i++) {            
                        var thisspan=eval("document.all.d"+i+".style")               
                        if (thisspan.posLeft>marginright) {
                                    thisspan.posLeft-=Math.abs(stepx[i]+1)
                                    stepx[i]=randomspeed(floatingspeed)*-1           
                        }
                        if (thisspan.posLeft<marginleft) {
                                    thisspan.posLeft+=Math.abs(stepx[i])
                                    stepx[i]=randomspeed(floatingspeed)                           
                        }          
                        if (thisspan.posTop>marginbottom) {
                                    thisspan.posTop-=Math.abs(stepy[i])
                                    stepy[i]=randomspeed(floatingspeed)*-1
                        }
                        if (thisspan.posTop<margintop) {
                                    thisspan.posTop+=Math.abs(stepy[i])
                                    stepy[i]=randomspeed(floatingspeed)
                        }
            }
}

function checktime() {
    if (nowtime<gamemaxseconds && stopit==false) {
                nowtime=new Date()
                nowtime=nowtime.getTime()
        nowtime=(nowtime-starttime)/1000
                        var countdown=gamemaxseconds-nowtime
                        countdown=Math.floor(countdown*100)/100
                        if (countdown<0) {countdown=0}
        timesign.innerHTML="<font size=1 face=Arial color="+timecolor+">"+countdown+"</font>"
        timetimer=setTimeout("checktime()",100)
    }
            else if (stopit==true) {
                        clearTimeout(timetimer)
                        for (i=0;i<=dotsmax;i++) {            
                                    var thisspan = eval("document.all.d"+(i)+".style")
                                    thisspan.visibility="hidden"
                        }
            }
    else {
        clearTimeout(timetimer)
                        endgame()
    }
}

function endgame() {
            timecolor="000000"
            if (correctanswers<=5) {
                        resultboard.innerHTML="<table width=80 height=132 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=red><font face=Arial size=1 color=white>Game over.<br>Correct: "+correctanswers+"<br><br>Not good enough for our hall of fame<br><br>Try again.</font></td></tr></table>"
                        document.all.resultboard.style.visibility="visible"
                        timesign.innerHTML=""
            }
            else {
                        resultboard.innerHTML="<table width=80 height=132 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center bgcolor=red><font face=Arial size=1 color=white>Game over.<br>Correct answers: "+correctanswers+"</font></td></tr></table>"
                        document.all.resultboard.style.visibility="visible"
                        timesign.innerHTML=""
                        pophalloffame()
            }
}

function pophalloffame() {
                        var popup=window.open("", "hall", "status=no,location=no,toolbar=no,menubar=no,resizable=no,scrollbars=no,width=235,height=180,top=100,left=210")
                        popup.document.writeln("<HTML><HEAD><TITLE>HALL OF FAME</TITLE></HEAD><BODY>")
                        popup.document.writeln("<table border=0 cellpadding=2 cellspacing=0 width=210>")
           
                        popup.document.writeln("<tr><td bgcolor=000000>")
            popup.document.writeln("<font face=Verdana size=1 color=white><strong>Cool Prizes for EyeQ Cracks</strong></font>")
            popup.document.writeln("</td></tr>")
                       
                        popup.document.writeln("<tr><td><br></td></tr>")
           
                        popup.document.writeln("<tr><td><font face=Verdana size=1 color=black>Add your top results to our realtime Hall of Fame.<br><br><a href=\"http://www.24fun.com/cgi-bin/eyeq.pl\" target=\"_blank\"><strong><font face=Verdana size=1 color=black>Click here.</font></strong></a>")
                        popup.document.writeln("</td></tr></table>")
                        popup.document.writeln("</BODY></HTML>")
                        popup.document.close()
}

function ov(thisleft,thistop) {
            document.all.l.style.posLeft=thisleft
            document.all.l.style.posTop=thistop
            document.all.r.style.posLeft=thisleft+17
            document.all.r.style.posTop=thistop
            document.all.t.style.posLeft=thisleft
            document.all.t.style.posTop=thistop
            document.all.b.style.posLeft=thisleft
            document.all.b.style.posTop=thistop+12
}

function ou() {
            document.all.l.style.posLeft=0
            document.all.l.style.posTop=0
            document.all.r.style.posLeft=0
            document.all.r.style.posTop=0
            document.all.t.style.posLeft=0
            document.all.t.style.posTop=0
            document.all.b.style.posLeft=0
            document.all.b.style.posTop=0
}



if (document.all) {
            document.write("<div id=\"roof\" style=\"position:absolute;left:"+gameleft+"px;top:"+gametop+"px\">")
            document.write("<div id=\"quickeyeskin\" style=\"position:absolute;visibility:hidden;left:0px;top:0px\">")
            document.write("<IMG SRC=\"skin.gif\" USEMAP=\"#skin\" BORDER=0>")
            document.write("<MAP NAME=\"skin\">")
            document.write("<AREA SHAPE=RECT COORDS=\"34,115,51,127\" HREF=\"javascript:guess('1')\" onMouseOver=\"ov(34,115)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"55,115,72,127\" HREF=\"javascript:guess('2')\" onMouseOver=\"ov(55,115)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"76,115,93,127\" HREF=\"javascript:guess('3')\" onMouseOver=\"ov(76,115)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"97,115,114,127\" HREF=\"javascript:guess('4')\" onMouseOver=\"ov(97,115)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"34,132,51,144\" HREF=\"javascript:guess('5')\" onMouseOver=\"ov(34,132)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"55,132,72,144\" HREF=\"javascript:guess('6')\" onMouseOver=\"ov(55,132)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"76,132,92,143\" HREF=\"javascript:guess('7')\" onMouseOver=\"ov(76,132)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"97,132,113,143\" HREF=\"javascript:guess('8')\" onMouseOver=\"ov(97,132)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"34,149,51,161\" HREF=\"javascript:guess('9')\" onMouseOver=\"ov(34,149)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"55,149,72,160\" HREF=\"javascript:guess('10')\" onMouseOver=\"ov(55,149)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"77,149,92,161\" HREF=\"javascript:guess('11')\" onMouseOver=\"ov(76,149)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"97,149,114,161\" HREF=\"javascript:guess('12')\" onMouseOver=\"ov(97,149)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"34,166,51,178\" HREF=\"javascript:guess('13')\" onMouseOver=\"ov(34,166)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"55,166,72,178\" HREF=\"javascript:guess('14')\" onMouseOver=\"ov(55,166)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"77,166,93,178\" HREF=\"javascript:guess('15')\" onMouseOver=\"ov(76,166)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"98,166,113,178\" HREF=\"javascript:guess('16')\" onMouseOver=\"ov(97,166)\" onMouseOut=\"ou()\">")
            document.write("<AREA SHAPE=RECT COORDS=\"76,184,113,194\" HREF=\"javascript:stopgame()\">")
            document.write("</MAP>")
            document.write("</div>")

            for (i=0;i<=dotsmax;i++) {
                        document.write("<div id=\"d"+i+"\" style=\"position:absolute;left:0px;top:0px\"><img src=\"dot.gif\"></div>")
            }
           
            document.write("<div id=\"resultboard\" style=\"position:absolute;left:35px;top:48px\"><table width=80 height=60 border=0 cellpadding=5 cellspacing=0><tr valign=middle><td align=center><font face=Arial size=1 color=000000>Click start and guess the number of dots.<br>time: 30 sec.</font></td></tr></table></div>")

            document.write("<div id=\"resultbar\" style=\"position:absolute;left:35px;top:41px\"></div>")
           
            document.write("<div id=\"resultbarskin\" style=\"position:absolute;left:35px;top:33px\"><img src=\"resultbarskin.gif\"></div>")

            document.write("<div id=\"timesign\" style=\"position:absolute;visibility:visible;left:39px;top:185px;\"></div>")

            document.write("<div id=\"l\" style=\"position:absolute;left:0px;top:0px;\"><table cellpadding=0 cellspacing=0 border=0><tr><img src=\"white.gif\" height=13 width=1><td></td></tr></table></div>")
            document.write("<div id=\"r\" style=\"position:absolute;left:0px;top:0px;\"><table cellpadding=0 cellspacing=0 border=0><tr><img src=\"white.gif\" height=13 width=1><td></td></tr></table></div>")
            document.write("<div id=\"t\" style=\"position:absolute;left:0px;top:0px;\"><table cellpadding=0 cellspacing=0 border=0><tr><img src=\"white.gif\" height=1 width=18><td></td></tr></table></div>")
            document.write("<div id=\"b\" style=\"position:absolute;left:0px;top:0px;\"><table cellpadding=0 cellspacing=0 border=0><tr><img src=\"white.gif\" height=1 width=18><td></td></tr></table></div>")

            document.write("</div>")
           
            document.close()
            onload=positiongame
}