Results 1 to 3 of 3

Thread: Ultimate Fade-In Slideshow Alter First Pause

  1. #1
    Join Date
    Dec 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Ultimate Fade-In Slideshow Alter First Pause

    1) Script Title: Ultimate Fade-In Slideshow

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...deslideshow.js

    3) Describe problem: I'd like to alter the pause for the very first change. Not index 0 altogether, but the first time only (cycles = 0, don't want a different pause every time it comes up, just the first time). The need is that I have 4 galleries on the page running, and would like to stagger their changes. For example, all have a pause of 20000; once the page loads, I'd like the first gallery to change after 5000, the second after 10000, etc.; the result would be that every 5000, (only) one of the 4 galleries changes. I've been playing around with oninit but can't seem to get it right.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    That can be done but unless all the images in all of the shows are cached/preloaded first, the timing will not be exact for most folks visiting for the first time.

    That said, what you can do is set the initial pause that you want in the normal spot and use an onslide, not oninit function to change it to what you want it to be once the 2nd image (index 1) has slid in:

    Code:
    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://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
    		["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
    		["http://i30.tinypic.com/531q3n.jpg"],
    		["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
    	],
    	displaymode: {type:'auto', pause:5000, cycles:0, wraparound:false},
    	persist: false, //remember last viewed slide and recall within same session?
    	fadeduration: 500, //transition duration (milliseconds)
    	descreveal: "ondemand",
    	togglerid: "",
    	onslide: function(fglayer, index){
    		if(index == 1){
    			this.setting.displaymode.pause = 20000;
    			this.setting.onslide = function(){};
    		}
    	}
    })
    Don't miss the added comma (red) after the togglerid value.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Dec 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks John. That did the trick - and makes total sense after seeing your solution. The timing's not perfect first time, as you indicated, but plenty close enough.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •