I have two buttons that display each different image when clicked, but I want the image to appear on the same page with buttons dynamically. Can somebody fix up this codes? Thank you. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-kr" /> <title>Untitled Document</title> </head> <script type="text/javascript"> var image = new Array("http://userpages.umbc.edu/~dhood2/courses/cmsc433/spring2006/Miscellaneous/JavaScript/p1/hangman0.gif", "http://userpages.umbc.edu/~dhood2/courses/cmsc433/spring2006/Miscellaneous/JavaScript/p1/hangman6.gif"); function getValue(button) { button.disabled = true; displayHangman(button.value); } function getNumber() { return number; } function displayHangman(number){ document.write('<image src="' + image[number] + '" id="hangman" />'); } </script> <body> <div id="hanger"> <script type="text/javascript"> //displayHangman(number); </script> </div> <div id="options"> <input type="button" onclick="getValue(this);" value="0" /> <input type="button" onclick="getValue(this);" value="1" /> </div> </body> </html> Code (markup):
well... i didnt bother to lookup the code... but i have an alternative easy way: <A HREF="yourlinkgoeshere.html" onMouseDown = "document.images['imBut'].src='imButdown.gif'" onMouseUp = "document.images['imBut'].src='imButUp.gif'"> <IMG NAME="imBut" SRC="imButup.gif" WIDTH=62 HEIGHT=28 BORDER=0></A> Code (markup): it's from webreference.com; you may want to check out the whole tut for explainations: webreference.com/dhtml/column1/