advance ultimate fade-in slideshow on mouse click.

[gary.mcgill]

1) Script Title: Ultimate fade-in slideshow Ver. 1.51

2) Script URL (on DD):

3) Describe problem: When a user does a mouse over the image pauses. That is great. Is there a way to have it advance to the next slide if the user clicks the mouse? I want to do this so the user can quickly go through the images instead of waiting for the default time.

Thanks!

[jscheuer1]

Add the highlighted as shown to the on page init:

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [328, 310], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["dongbistroimg/slide-1a-salad.png", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
		["dongbistroimg/slide-1b-figs.png", "", "_new", "Some day I'd like to explore these caves!"],
		["dongbistroimg/slide-1c-pizzachef.png"],
		["dongbistroimg/slide-1d-plumdrink.png", "", "", "What a beautiful scene with everything changing colors."] //<--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",
	oninit: function(){
		var ss = this;
		this.setting.$wrapperdiv.click(function(){ss.setting.ismouseover = false; ss.showslide('next'); ss.setting.ismouseover = true;});
	},
	togglerid: ""
})

[gary.mcgill]

It caused the show to be blank. here is the code from my page:
<td height="225"><script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(fadeimages, 977, 328, 0, 10000, 1, "R")
oninit: function(){
var ss = this;
this.setting.$wrapperdiv.click(function(){ss.setting.ismouseover = false; ss.showslide('next'); ss.setting.ismouseover = true;}); }
</script></td>

Did I do something wrong?

[jscheuer1]

Sorry, wrong version. My advice would be to update to the current version:

http://www.dynamicdrive.com/dynamici...nslideshow.htm

But if you're attached to version 1.51, use this demo:

http://home.comcast.net/~jscheuer1/s...1_click_go.htm

Use your browser's "View Source" to get the code. Both the main script and the init have changed.

[gary.mcgill]

That worked but when I move the mouse off the image after clicking a few times it goes crazy and starts advancing the images as fast as it can. It is strange that I could not duplicate this issue using your example although I cut and pasted the exact code from your page to mine. I have my time set to 10000 and my images set to 977x328 if that matters. it seems to loose the time setting somewhere in the manual advance script. Is there a fix for this? --Thanks!--

[jscheuer1]

Both the main script and the init have changed.

You must use the updated v 1.51 main script as well (the fadepic and at least one other function needed to be changed). Use your browser's "View Source" to get the code.

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.

[gary.mcgill]

Cool!! That worked great. Thank you very much for your help!

[gary.mcgill]

I just noticed on my wife's PC using Firefox Ver 26 it shows a blank area where the images should be. I tried it on another PC and got the same result. I renamed the new file and put the old file back which works on her PC. If you have a minute, you can view the new page at http://www.kimwatt.org/newindex.html It works fine on my Mac using Firefox. Not sure why it is doing this. I really liked being able to advance the images manually. Thanks!

[jscheuer1]

here:

		s.resetit();
		s.rotateimage();
		s.mouseovercheck=1;
	}
})(new fadeshow(fadeimages, 977, 328, 0, 10000, 1, "R"));
		
	//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
	//new fadeshow(fadeimages, 977, 328, 0, 10000, 1, "R")
		
		</script></td>

either add the red comment tokens as shown, or remove that (highlighted) line. It's not required. On the demo it was just a comment. Why did you remove its comment tokens? In any case, you don't need it, nor the line (green) immediately after it. But, as long as the // comment tokens remain in front of them, they can still be there.

[gary.mcgill]

I didn't realize I deleted the comment tokens... Sorry. Thanks again for your help!