How to make a photo change on mouse over?

picture one is jnd1.jpg (150 x 150)


picture 2 is jnd2.jpg(150 x 150)





First fully working non java html code will get 10 pts as soon as i can award itHow to make a photo change on mouse over?
I've used this free generator.How to make a photo change on mouse over?
the best way to do this is java only


to watch java solution go to


http://www.dynamicdrive.com/dynamicindex鈥?/a>


this effect is called


';image rollover';


just Google it and you will find 1000+ solutions..


an other example of java


http://www.dynamicdrive.com/dynamicindex鈥?/a>


here is my example








* The following HTML/JavaScript is put inside the document head:





%26lt;script type=';text/javascript';%26gt;


var a = new Image(); a.src = 'root.gif';


var b = new Image(); b.src = 'hover.gif';


var c = new Image(); c.src = 'active.gif';


%26lt;/script%26gt;





* Regular image:





%26lt;img src=';root.gif'; height=';50'; width=';50'; alt=';'; border=';0';%26gt;





* Hover:





%26lt;a href=';whatever'; onmouseover=';document.images['s1a'].src=鈥?onmouseout=';document.images['s1a'].src='鈥?src=';root.gif'; name=';s1a'; height=';50'; width=';50'; alt=';'; border=';0';%26gt;%26lt;/a%26gt;





* Click:





%26lt;a href=';whatever'; onmouseout=';document.images['s2a'].src='鈥?onmousedown=';document.images['s2a'].src=鈥?onmouseup=';document.images['s2a'].src='r鈥?src=';root.gif'; name=';s2a'; height=';50'; width=';50'; alt=';'; border=';0';%26gt;%26lt;/a%26gt;





* Hover and click:





%26lt;a href=';whatever'; onmouseover=';document.images['s3a'].src=鈥?onmouseout=';document.images['s3a'].src='鈥?onmousedown=';document.images['s3a'].src=鈥?onmouseup=';document.images['s3a'].src='h鈥?src=';root.gif'; name=';s3a'; height=';50'; width=';50'; alt=';'; border=';0';%26gt;%26lt;/a%26gt;








there is three type of mouse effect hover you talk about click plus hover and click i mentioned above .... hope this will help...
%26lt;html%26gt;


%26lt;body%26gt;


%26lt;img id=';i'; src=';jnd1.jpg';


onmouseover = 'document.getElementById(';i';).src = ';jnd2.jpg';'


onmouseout = 'document.getElementById(';i';).src = ';jnd1.jpg';'/%26gt;


%26lt;/body%26gt;


%26lt;/html%26gt;