Creating link in a web "slide show"? |
Creating link in a web "slide show"? |
kelpman |
May 30 2012, 09:48 AM
Post
#1
|
Group: Members Posts: 4 Joined: 30-May 12 Member No.: 17,193 |
Site address: lonecoast.com
I am trying to make a product display that uses thumbnail images on one side of the page and a large close up of the image when a thumbnail is clicked that will show a large version of the thumbnail. I found a site that explained the code for this, and I got it to work. The code is this: <head> <script type="text/javascript"> function changeIt(imageName,objName) { var obj = document.getElementById(objName); var imgTag = "<img src='"+imageName+"' border='0' />"; obj.innerHTML = imgTag; return; } </script> </head> <body> <div id="image1"> <img src="product1.png"> </div> <a id="one" href="#" onclick="changeIt('product1.png','image1');"> <src="product1thumbnail.png" /></a> <a id="two" href="#" onclick="changeIt('product2.png','image1');"> <src="product 2thumbnail.png" /></a> </body> So, click image "product1thumbnail.png" and the other image switches to product1.png; click "product2thumbnail.png" and the other image changes to product2.png. This works great. But now the next step is I want the enlarged view of the product to link to its respective site page. How do I make product1.png and product2.png clickable, so that product1.png links to product1.html and product2.png links to product2.html? This post has been edited by kelpman: May 30 2012, 09:53 AM |
kelpman |
May 30 2012, 08:02 PM
Post
#2
|
Group: Members Posts: 4 Joined: 30-May 12 Member No.: 17,193 |
She lives!
Thank you so much for all the help. |
pandy |
May 31 2012, 02:33 AM
Post
#3
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Great! You are welcome.
|
Lo-Fi Version | Time is now: 23rd April 2024 - 07:33 AM |