var images = [

	{
					src: 'cherish gallery/thumbs/tn_Akeira BETSEY COUTURE BRIDE.jpg',
					srcBig: 'cherish gallery/images/Akeira BETSEY COUTURE BRIDE.jpg',
					title: 'Akeira',
					longDescription: '<b><h1>Akeira</h1></b><br><b>Betsey Couture<br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours  Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:cherishbridal@yahoo.co.uk?subject=Web Enquiry Regarding Romantica Charmaine Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>'
				},

					{
					src: 'romanticabride/thumbs/tn_Charmaine.jpg',
					srcBig: 'romanticabride/images/Charmaine.jpg',
					title: 'Charmaine',
					longDescription: '<b><h1>Charmaine</h1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours  Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:cherishbridal@yahoo.co.uk?subject=Web Enquiry Regarding Romantica Charmaine Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>'
				},



				{
					src: 'cherish gallery/thumbs/Willow_thumbnail.jpg',
					srcBig: 'cherish gallery/images/Willow_preview.jpg',
					title: 'Snowdrop',
					longDescription: '<b><h1>Willow</h1></b><br><b>Opulence<br><br><b><H2>Colours  Available:</h2><b><br>IVORY/SILVER, WHITE SILVER<br>Please Enquire Below<br><br><br><br><a href="mailto:cherishbridal@yahoo.co.uk?subject=Web Enquiry Regarding Opulence Willow Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>'
				}
			]

				$(function(){
				var container = $('#thumbsContainer');
				$.each(images, function(index, value) {
					var image = $('<img>')
						.attr('src', value.src)
						.attr('title', value.title)
						.attr('alt', value.srcBig);


					container.append(image);
				});
			});

			$('#thumbsContainer img').live('click', function(e) {
				var index = $('#thumbsContainer img').index(this);
				showDressInfo(index);
			});

			function showDressInfo(index) {
				var value = images[index].longDescription;
				$('#dressinfo').html(value);
			}


			$(function(){showDressInfo(0);});

<HERE IS HOW I AM DOING THE THUMBNAIL ONE..  AS THIS JUST SHOWS WHICHEVER IS CLICKED..
I NEED TO DO soMETHING SIMILAR FOR clicking cusorLeft and cursorRight.  So I assume it either can index the images and then display the relevant longDescription.  or do some kind of -1 / +1 thingn

THE BEHAVIOUR OF THE CURSORS ARE AS FOLLOWS :

$('#displayed').live('mousemove',function(e){
		var $this 		= $(this);
		var imageWidth 	= parseFloat($this.css('width'),20);

		var x 			= e.pageX - $this.offset().left;
		if(x<(imageWidth/3))
			$this.addClass('cursorLeft').removeClass('cursorPlus cursorRight cursorMinus');
		else if(x>(2*(imageWidth/3)))
			$this.addClass('cursorRight').removeClass('cursorPlus cursorLeft cursorMinus');
		else{
			if(mode=='expanded'){
				$this.addClass('').removeClass('cursorLeft cursorRight cursorPlus');
			}
			else if(mode=='small'){
				$this.addClass('').removeClass('cursorLeft cursorRight cursorMinus');
			}
		}
	}).live('click',function(){
		var $this = $(this);
		if(mode=='expanded' && $this.is('.cursorMinus')){
			mode='small';
			$this.addClass('cursorPlus').removeClass('cursorLeft cursorRight cursorMinus');
			$('#thumbsWrapper').stop().animate({'bottom':'0px'},300);
			resize($this,1);
		}
		else if(mode=='small' && $this.is('.cursorPlus')){
			mode='expanded';
			$this.addClass('cursorMinus').removeClass('cursorLeft cursorRight cursorPlus');
			$('#thumbsWrapper').stop().animate({'bottom':'-85px'},300);
			resize($this,1);
		}
		else if($this.is('.cursorRight')){

			var $thumb = $('#thumbsContainer img:nth-child('+parseInt(current+1)+')');
			if($thumb.length){
				++current;
				loadPhoto($thumb,'cursorRight');
			}
		}
		else if($this.is('.cursorLeft')){
			var $thumb = $('#thumbsContainer img:nth-child('+parseInt(current-1)+')');
			if($thumb.length){
				--current;
				loadPhoto($thumb,'cursorLeft');
			}
		}
	});