Changing the initial slide displayed with the Simple Controls Gallery

[sdenn]

1) Script Title: Simple Controls Gallery

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...plegallery.htm

3) Describe problem: When the gallery is displayed, the initial slide is set to the first. However, in my case, I have a need to *sometimes* start the gallery on the last slide, not always the first. Is there a way to launch the slideshow to have a variable to start it on first or last? I don't want to change the order of the slides, just begin the slideshow on the last slide

I'm not all that familiar with Javascript, but the code has the following...here's the snipit...

dfd.done(function(){ //execute when all images have loaded
setting.$loadinggif.remove()
setting.$wrapperdiv.bind('mouseenter', function(){slideshow.showhidenavpanel('show')})
setting.$wrapperdiv.bind('mouseleave', function(){slideshow.showhidenavpanel('hide')})
slideshow.showslide(setting.curimage) //show initial slide

setting.oninit.call(slideshow) //trigger oninit() event

So with slideshow.showslide(setting.curimage), I'd like to be able to display the last slide in the array as the initial. Can anyone suggest an easy way on how to do this? Thanks!

[jscheuer1]

You don't need to edit the script. You can just set the curimage value right on the page. You have something like so to initialize the gallery on the page:

<script type="text/javascript">

var mygallery=new simpleGallery({
	wrapperid: "simplegallery1", //ID of main gallery container,
	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
	imagearray: [
		["pool.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new", ""],
		["cave.jpg", "http://en.wikipedia.org/wiki/Cave", "", ""],
		["fruits.jpg", "", "", ""],
		["autumn.jpg", "", "", ""]
	],
	autoplay: [true, 2500, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
	persist: false,
	fadeduration: 500, //transition duration (milliseconds)
	oninit:function(){ //event that fires when gallery has initialized/ ready to run
	},
	onslide:function(curslide, i){ //event that fires after each slide is shown
		//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
		//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
	}
})

mygallery.setting.curimage = mygallery.setting.imagearray.length - 1;

</script>

Just add the highlighted line at the end there as shown. Notice that the same variable name that was used to initialize the gallery (mygallery, shown in red) is used in two places to set the curimage value to that of the last slide's index in the gallery's imagearray.

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

That's it, couldn't be much simpler, unless you also want a way to determine whether or not to do that based upon the URL used to navigate to the page. For that you can use either server side code or more javascript. If you need that and want help with that, just let me know.

[sdenn]

You don't need to edit the script. You can just set the curimage value right on the page. You have something like so to initialize the gallery on the page:

Just add the highlighted line at the end there as shown. Notice that the same variable name that was used to initialize the gallery (mygallery, shown in red) is used in two places to set the curimage value to that of the last slide's index in the gallery's imagearray.

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

That's it, couldn't be much simpler, unless you also want a way to determine whether or not to do that based upon the URL used to navigate to the page. For that you can use either server side code or more javascript. If you need that and want help with that, just let me know.

Wonderful John. That was the magic line. I also have an xml file that I read to determine whether or not to display the first or last slide initially. So, I took your line of code and wrapped in some php and BINGO...success!

<?php if($xml->TAB[$p_index]->LOOP=="Last"){?>
mygallery.setting.curimage = mygallery.setting.imagearray.length - 1;
<? } ?>