Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Adding links to onclick images in a slideshow

Status
Not open for further replies.

Fotoman

Technical User
May 7, 2003
48
GB
I have tailored a script to show larger photographs when the thumbnails are clicked.
I would now like to be able to add a hyperlink to each of the large images (when they are displayed) which, when clicked will go to the relevant page.
It obviously involves an <a href command that should go somewhere but I can't see it. Probably because I am still learning Javascript!
I have placed the hyperlink command at the beginning of the 'onclick' script but it doesn't work.
I would be grateful for any help in telling me where I should be putting the link script, if indeed it can be done.

Thank you in inticipation of a solution.

Fotoman

Crime Pays...
...unless you're a motorist!
 
You'll have add a real physical href tag around the image in your HTML code, and hen have the JS change the link tag's href attribute to whatever it is you want for the specified image.

HTML:
...
return(loadPosterImage('images/bungee/bg005.png', "[red][URL unfurl="true"]http://domain.com/path/to/page.html[/URL][/red]"))
...

[red]<a href="#" id="largeImageLink">[/red]<img src="images/bar_fly/bf006.png" name="imagePoster" align="TOP" border="0"
     alt="Inflatable Play Structures" width="510" height="300"> [red]</a>[/red]

Code:
function loadPosterImage(imageURL,linkURL) {
	if (gImageCapableBrowser) {
		document.imagePoster.src = imageURL;
[red]                document.largeImageLink.href=linkURL;[/red]

NOTE1: I typed this directly into the reply box so there could be errors, but that's the gist of it.

NOTE2: I suggest looking into more modern techniques of website building. CSS and semantic layout, rather than old fashioned tables, and complex structure.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.
 
Thanks Vacunita, I give this go.

Yes, I do need to bring myself up to date, but I'm doing this for a friend and I do have a day job! One day I'll get round to it.

Fotoman

Crime Pays...
...unless you're a motorist!
 
Right, I've had a go at adding and changing the code as you suggested.
Now, when clicking the thumbnails, nothing happens; the larger image of the thumbnail does not appear in the right-hand box.
I have put the page name inflatables.htm in place of the # in the <a href="#" to keep the viewer on the same page until they click a thumbnail and then click the larger image to go off to that particular page.
What I'm, after is to click any of the thumbnails and then to be able to click on the larger image that then displays to take you to the different pages. (There will be 8 pages linking from all 8 of the large images)

Sorry, but I did say that I'm rather new to this and I've probably done something wrong or not done something I should have!

I hope you can help.

Crime Pays...
...unless you're a motorist!
 
 http://www.knockoutentertainments.com/KOE2/inflatables.htm
OK, ignore this last post.
I'm still playing around with this and need to put some bits back in.

I'll be back later.

Crime Pays...
...unless you're a motorist!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top