 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 |
  |
 
|
  |
Replies
| pandy |
May 30 2012, 10:09 AM
Post
#2
|
|
🌟Computer says no🌟  Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Add the link to the markup that is injected, here:
CODE var imgTag = "<img src='"+imageName+"' border='0' />"; You need another variable to hold the URL for the link that you can pass from the onclick as you do with the image URL. |
|
|
|
Posts in this topic
kelpman Creating link in a web "slide show"? May 30 2012, 09:48 AM
kelpman Thanks for the response.
Could you show me an exa... May 30 2012, 01:06 PM
pandy The quotes are messed up. I can't keep track o... May 30 2012, 01:47 PM kelpman There we go. That worked.
Ok, so the last part i... May 30 2012, 03:03 PM pandy
Do you list all of the pages you are linking to ... May 30 2012, 03:31 PM kelpman She lives!
Thank you so much for all the help... May 30 2012, 08:02 PM pandy Great! You are welcome. :) May 31 2012, 02:33 AM |
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 25th April 2024 - 03:45 PM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC