/* Ultimate Fade-in slideshow (v2.1)
* Last updated: Sept 10th, 2009. This notice must stay intact for usage 
* Author: Dynamic Drive at http://www.dynamicdrive.com/
* Visit http://www.dynamicdrive.com/ for full source code
*/

// FOR INSTRUCTIONS ON THE DIFFERENT SETTINGS VISIT http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [161, 457], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["uploaded_images/nav_repmusic-02-Andrew.jpg"],
		["uploaded_images/nav_repmusic-03-Duo.jpg"],
		["uploaded_images/nav_repmusic-04-Vilem.jpg"],
		["uploaded_images/nav_repmusic-05-Kirsty.jpg"],
		["uploaded_images/nav_repmusic-06-Robin.jpg"] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:2000, cycles:0, wraparound:false, randomize:true},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "always",
	togglerid: ""
})


// USE THE BELOW FOR AN ADDITIONAL SLIDE SHOW EITHER ON THE SAME PAGE OR A DIFFERENT PAGE, JUST CREATE <div id="fadeshow2"></div> WHERE IT NEEDS TO GO IN THE PAGE
//var mygallery=new fadeSlideShow({
//	wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
//	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
//	imagearray: [
//		["http://photo.wordserver.co.uk/uploaded_images/15_570.jpg"],
//		["http://photo.wordserver.co.uk/uploaded_images/11_570.jpg"],
//		["http://photo.wordserver.co.uk/uploaded_images/24_570.jpg"],
//		["http://photo.wordserver.co.uk/uploaded_images/09_570.jpg"] //<--no trailing comma after very last image element!
//	],
//	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
//	persist: false, //remember last viewed slide and recall within same session?
//	fadeduration: 500, //transition duration (milliseconds)
//	descreveal: "always",
//	togglerid: ""
//})



// USE THE BELOW FOR POPUP DESCRIPTION/CAPTIONS AND ALSO LINKING TO WEBSITES OR PAGES IN A NEW WINDOW OR THE SAME WINDOW, CHANGE descreval TO ondemand FOR POPUP CAPTION OR always FOR CONSTANT DISPLAY
//var mygallery=new fadeSlideShow({
//	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
//	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
//	imagearray: [
//		["http://photo.wordserver.co.uk/uploaded_images/15_570.jpg", "http://www.google.co.uk", "_new", "Here is a popup caption when you hover over the image, it also links to google in a new window"],
//		["http://photo.wordserver.co.uk/uploaded_images/11_570.jpg", "http://www.google.co.uk", "", "Here is another caption, it links to google in the same window"],
//		["http://photo.wordserver.co.uk/uploaded_images/24_570.jpg", "http://www.google.co.uk"],
//		["http://photo.wordserver.co.uk/uploaded_images/09_570.jpg"] //<--no trailing comma after very last image element!
//	],
//	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
//	persist: false, //remember last viewed slide and recall within same session?
//	fadeduration: 500, //transition duration (milliseconds)
//	descreveal: "ondemand", //<-- OPTIONS: ondemand FOR POPUP CAPTION, always FOR CONSTANTLY DISPLAYED CAPTIONS
//	togglerid: ""
//})

// USE THE BELOW FOR POPUP DESCRIPTION/CAPTIONS THAT CAN BE HIDDEN AND RESTORED CLICKING THE BUTTON IN THE BOTTOM RIGHT CORNER OF THE IMAGE
//var mygallery=new fadeSlideShow({
//	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
//	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
//	imagearray: [
//		["http://photo.wordserver.co.uk/uploaded_images/15_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/11_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/24_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/09_570.jpg", "", "", "Here is another caption"] //<--no trailing comma after very last image element!
//	],
//	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
//	persist: false, //remember last viewed slide and recall within same session?
//	fadeduration: 500, //transition duration (milliseconds)
//	descreveal: "always", //<-- OPTIONS: ondemand FOR POPUP CAPTION, always FOR CONSTANTLY DISPLAYED CAPTIONS
//	togglerid: ""
//})

// USE THE BELOW TO INCLUDE A TOGGLE, WHICH ALLOWS THE USER TO BROWSE THROUGH IMAGES RATHER THAN THE AUTOMATIC FADE. YOU NEED TO REFERENCE A TOGGLE ID ON THE LAST LINE. YOU ALSO NEED TO ADD A NEW <DIV> TO THE WEB PAGE, CODE EXAMPLE AT BOTTOM
//var mygallery=new fadeSlideShow({
//	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
//	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
//	imagearray: [
//		["http://photo.wordserver.co.uk/uploaded_images/15_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/11_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/24_570.jpg", "", "", "Here is another caption"],
//		["http://photo.wordserver.co.uk/uploaded_images/09_570.jpg", "", "", "Here is another caption"] //<--no trailing comma after very last image element!
//	],
//	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
//	persist: false, //remember last viewed slide and recall within same session?
//	fadeduration: 500, //transition duration (milliseconds)
//	descreveal: "always", //<-- OPTIONS: ondemand FOR POPUP CAPTION, always FOR CONSTANTLY DISPLAYED CAPTIONS
//	togglerid: "fadeshow1toggler"
//})

//<div id="fadeshow1toggler" style="width:270px; text-align:center; margin-top:10px">
//<a href="#" class="prev">PREVIOUS</a>  <span class="status" style="margin:0 50px; font-weight:bold"></span> <a href="#" class="next">NEXT</a>
//</div>