Source Code - JsMadeEasy.com

Metachecker.net

FontsMadeEasy.com

RankChecker.net

Learn Java Script Today

Over 5000 Free Fonts

Tutorials

Javascript Forum

Other Javascript Resources

Advance DHTML Tutorial

Changing Image - Dialogue Text Area

Put your mouse over the images to see them change and the appropriate message will appear in the textarea.

Insert into <HEAD>

if (navigator.appVersion.indexOf("2.") != -1){
        check = false;
        }
if ((navigator.appVersion.indexOf("3.") != -1) && (navigator.appName.indexOf("Explorer") != -1)){
        check = false;
        }
else {
        check = true;
        }
if (check == true){
	image1= new Image();
	image1.src = "IMAGE #1 OFF";
	image1on = new Image();
	image1on.src = "IMAGE #1 ON";
	image2= new Image();
	image2.src = "IMAGE #2 OFF";
	image2on = new Image();
	image2on.src = "IMAGE #2 ON";
}

dialogue = new Array();
dialogue[0] = "TEXT THAT YOU WANT TO APPEAR WHEN THE MOUSE IS NOT OVER AN IMAGE";
dialogue[1] = "FIRST COMMENT";
dialogue[2] = "SECOND COMMENT";

function writeDia(diaIndex ){
	if (check == true){
		document.dialogue.tips.value = dialogue[diaIndex];
	}
}
function imageon(name){
	if (check == true){
        	document[name].src = eval(name + "on.src");
	}
}

function imageoff(name){
	if (check == true){
        	document[name].src = eval(name + ".src");
	}
}
// -->
</script>

Insert into <BODY>

Other Options

Adding More Images

First thing that you need to do is add the following lines to the top part of the script 
	image3= new Image();
	image3.src = "IMAGE #3 OFF";
	image3on = new Image();
	image3on.src = "IMAGE #3 ON";

and 
dialogue[3] = "THIRD COMMENT";

Your code should now look like this... 
<script language="JavaScript">
<!-- Hide JavaScript From old browsers

dialogue = new Array();
dialogue[0] = "TEXT THAT YOU WANT TO APPEAR WHEN THE MOUSE IS NOT OVER AN IMAGE";
dialogue[1] = "FIRST COMMENT";
dialogue[2] = "SECOND COMMENT";
dialogue[3] = "THIRD COMMENT";

function imageoff(name){
	if (check == true){
        	document[name].src = eval(name + ".src");
	}
}
// -->
</script>

The last thing is adding the new image, here is the code for that. 
<A HREF="YOUR LINK" onMouseOver="writeDia(3); imageon('image3'); return true" onMouseOut="writeDia(0); imageoff('image3');"><IMG SRC="YOUR IMAGE OFF" border=0 name="image3"></A>