Best books about Javasript

• JavaScript: The Definitive Guide
• JavaScript & DHTML Cookbook
• JavaScript Bible, Fifth Edition
• Beginning javascript

Try move mouse over the following list. Images will show dynamiclly.

• pig
• dog
• bird  

      Mouse over the above words

How to do it? It use "document.getElementById" to get collection in file and swap its image. Put the following script anywhere in your web page.

             <script type="text/javascript" language="javascript"> function swaptextimage (whichpic) { document.getElementById('animal').src = whichpic.href; document.getElementById('sound').childNodes[0].nodeValue = whichpic.title; return true; } </script>

Save the above images,including that hidden space holder image( or any images you choose) to your web page site. Then add the following code to your images.

<ul>
<li><a href="images/pig.gif" onmouseover="return swaptextimage(this)" title="Honk! Honk!">pig</a></li>
<li><a href="images/dog.gif" onmouseover="return swaptextimage(this)" title="Won! Won!">dog</a></li>
<li><a href="images/bird.gif" onmouseover="return swaptextimage(this)" title="Tweak! Tweak!">bird</a>&nbsp;&nbsp;
</ul>
<p id="sound" >Mouse over the above words</p>
<img id="animal" src="images/whitespace.gif" />

This code swaps text and image at the same time..