First Script: Roadblocked

[AlanLeffingwell]

Hi Everyone,This is my first JavaScript ever! The intended effect is: The screen is already divided into two panels, the left panel is a 'photo gallery' and the right panel is text about the image. The left panel has a main display area and a little scrolling region with thumbnails. When a user clicks a thumbnail the full size image appear in the left pane and the text about the image appears in the right pane. I've prototyped the script on a small scale and the process worked. I've compared everything I can think of and I see no difference yet it's not working.Here's my script:

/* This clears the display panel, then makes the image clicked visible	Designed by: Alan Leffingwell for: thelibertyfilm.com */function galleryDisplay(x){	document.GetElementById('tj').style.display='none';	document.GetElementById('tjtext').style.display='none';	document.GetElementById('claw').style.display='none';	document.GetElementById('clawtext').style.display='none';	document.GetElementById('kate').style.display='none';	document.GetElementById('katetext').style.display='none';	document.GetElementById('tarot').style.display='none';	document.GetElementById('tarottext').style.display='none';	if (x==1)	{		document.GetElementById('tj').style.display='';		document.GetElementById('tjtext').style.display='';	}	if (x==2)	{		document.GetElementById('claw').style.display='';		document.GetElementById('clawtext').style.display='';	}	if (x==3)	{		document.GetElementById('kate').style.display='';		document.GetElementById('katetext').style.display='';	}	if (x==4)	{		document.GetElementById('tarot').style.display='';		document.GetElementById('tarottext').style.display='';	}}/* These are the tags to be inserted into the thumbnail images <img onclick="galleryDisplay(1)" src="image.jpg" />The full size images, and paragraphs of text contain the following type id's<img id="imagename" /> <p id="imagenametext"> */

Here's the code for the regions calling the script:

<!-- Content Panels --><div class="body"><div class="leftpanel"><div class="imginset"><div class="gallerypadding"><img id="tj" src="./galleryimages/tj.jpg" /><br /><br /><img id="claw" src="./galleryimages/claw.jpg" /><br /><br /><img id="kate" src="./galleryimages/kate.jpg" /><br /><br /><img id="tarot" src="./galleryimages/tarot" /><br /><br /></div></div><div class="thumbnails"><p class="thumbpadding"><img onclick="galleryDisplay(1)" src="./galleryimages/tjthumb.jpg" /><br /><br /><img onclick="galleryDisplay(2)" src="./galleryimages/clawthumb.jpg" /><br /><br /><img onclick="galleryDisplay(3)" src="./galleryimages/katethumb.jpg" /><br /><br /><img onclick="galleryDisplay(4)" src="./galleryimages/tarotthumb.jpg" /><br /><br /></p></div></div><div class="rightpanel"><p id="tjtext" class="padding">Thomas Justice AKA TJ<br /><br />TJ is the combat-medic and lead investigator on a broadcast (television) show that everyone believes is real. On the show TJ is one part intellectual, one part action hero, and every part a government yes-man. Off the set however, TJ is a regular citizen with no combat experience, no understanding of the medical field, and no real friends or family. This is in part to the false identity required to be a lead character on a government broadcast.<br /><br />In his past life, TJ tried to follow his father’s footsteps and become a doctor. However, TJ lost sight of this goal when a few technical mistakes wound up killing a patient. Distraught, friendless, without any living relatives, TJ was the perfect candidate for a leading role on the government’s new show, Firstwave: Atwa Defense Force. With literally a new face and a new career TJ is thankful for the life the government has given him and tries not to think too much about the government's more seedy operations.<br /><br /><hr /></p><p id="clawtext" class="padding"> filler filler filler </p><p id="katetext" class="padding"> filler filler filler </p><p id="tarottext" class="padding"> filler filler filler </p></div></div>

In case people wonder how I linked the script to the document here's my <head>:

<head><title>The Liberty Film</title><link rel="stylesheet" type="text/css" href="styles.css" /><script type="text/javascript" src="scripts.js"></script></head>

Any assistance would be greatly greatly appreciated!! Kindest Regards,Alan Leffingwell

[jeffman]

I don't know what browser you're using, but Firefox claims there's no such function document.GetElementById (with a capital "G,"that is).

[AlanLeffingwell]

Sir, I am forever in your debt, and I apologize to the internet gods for such an incredible oversight!! Sure enough I check my prototype and it was lower case. I made the changes and it works perfectly - JavaScript is beautiful.Thanks so much for your help.. I hope soon enough when I get more time and knowledge I can provide the same help back to others just starting out. You've already been there for me on two occasions I will not forget to return the favor in the future my friend.Kindest Regards,Alan

[jeffman]

No sweat.

[Synook]

And get Firebug! (and never miss a JS error again) http://getfirebug.com/