Step Carousel Viewer v1.8 preloading?

[nhdlux]

1) Script Title: Step Carousel Viewer v1.8

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

3) Describe problem: i have implemented the script on the following website, but when it loads initially the ajaxloadr.gif shows up very briefly and it continues to preload with the forward button being hidden untill all 48 images are downloaded, i would have thought the ajaxloadr would keep spinning untill this is all done?

http://frank.nhd3.net/pictures.html

How can i make it preload correctly ?
Cheers

[ddadmin]

This is normal in the sense that the ajax spinning gif is shown only during the time the script is fetching the ajax contents- as soon as the contents are fetched, it disappears while the script initializes that content.

If you want to add some sort of indicator to show while the script is initializing, the best approach would probably be through the use of the oninit() event handler of the script. For example, you might have the following markup on your page that's shown while the script is initializing:

<div id="loadingstatus">Loading Carousel...</div>

Then using oninit(), you can hide this DIV once the script is loaded:

stepcarousel.setup({
galleryid: 'galleryC', //id of carousel DIV
beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
panelclass: 'panel', //class of panel DIVs each holding content
panelbehavior: {speed:300, wraparound:false, persist:true},
defaultbuttons: {enable: true, moveby: 1, leftnav: ['arrowl.gif', -10, 100], rightnav: ['arrowr.gif', -10, 100]},
statusvars: ['imageA', 'imageB', 'imageC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
contenttype: ['inline'], //content setting ['inline'] or ['external', 'path_to_external_file']
oninit:function(){
	document.getElementById("loadingstatus").style.display="none"
 }
})

[nhdlux]

Hi ddadmin
thanks for the initial quick response!
i didnt think of the oninit command, good idea
but when i implement the code, it kind of borks the slider, see example

http://frank.nhd3.net/pictures.html

cheers for your help

[ddadmin]

There's an error in your configuration code- it's missing a comma in red below:

stepcarousel.setup({
	galleryid: 'mygallery', //id of carousel DIV
	beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
	panelclass: 'panel', //class of panel DIVs each holding content
	autostep: {enable:false, moveby:1, pause:3000},
	panelbehavior: {speed:10, wraparound:false, persist:true},
	defaultbuttons: {enable: true, moveby: 1, leftnav: ['img/leftnav.gif', 0, 535], rightnav: ['img/rightnav.gif', -48, 535]},
	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
	contenttype: ['ajax', 'gallery_ajax.html'], //content setting ['inline'] or ['ajax', 'path_to_external_file']
	oninit:function(){
	document.getElementById("loadingstatus").style.display="none"
 }
})