Hello! (i'm new here so sorry if this is the wrong section...)
I've been searching for a script to replace text onClick of an image, however I haven't found quite what I'm looking for. When an image is clicked, I would like text to appear, however if another image is clicked, I would like some different text to appear in the same place, therefore replacing the previous text.
I hope you understand what I'm wanting.
Any help is greatly appreciated,
Thanks in advance.
It's easy to do what you want, but the exact code depends on where you want the text to appear on your page. You'll need to show the relevant parts of your HTML before anyone can give you an example of how to do this.
It's easy to do what you want, but the exact code depends on where you want the text to appear on your page. You'll need to show the relevant parts of your HTML before anyone can give you an example of how to do this.
Thank you very much for your reply.
I'll probably be putting the images into a scrollable box, and then I would like the text to appear at the top of the box, so the Javascript will be contained in there... if that helps.
I have managed to get this code, and both images appear along with a div where the text is replaced, however I can't seem to get the two images to show different text...
Code:
<div id="theText">Text</div><br> <input type = "image" src="http://www.webdeveloper.com/forum/images/misc/bookmarksite_digg.gif" onclick = "txtrep()"> <script type = "text/javascript"> function txtrep() { var newtext = "This is Digg."; document.getElementById('theText').innerHTML = newtext; }</script>
<input type = "image" src="http://www.webdeveloper.com/forum/images/misc/bookmarksite_google.gif" onclick = "txtrep()"> <script type = "text/javascript"> function txtrep() { var newtext = "This is Google."; document.getElementById('theText').innerHTML = newtext; }</script>
Right now you have two functions called "txtrep", so the second txtrep() function overwrites the first one. You should give both functions unique names.
Bookmarks