Advanced Search

Results 1 to 2 of 2

Thread: Can the Ultimate Fade-in slideshow be changed dynamically?

  1. #1
    Join Date
    Nov 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Can the Ultimate Fade-in slideshow be changed dynamically?

    1) Script Title: Ultimate Fade-in slideshow (v1.51)
    2) Script URL (on DD):
    http://www.dynamicdrive.com/dynamici...nslideshow.htm
    3) Describe problem:
    I want to change the displayed images dinamically. I'm working with ajax, so I'm not refreshing the hole page, just a part of it. I've tryed to chage the array of images depending on witch page you are on, but that doesn't work. I'm guessing I need to reinitialize everything. Can this be accomplished with the script, or do I have to change it?

    Thanks in advanced!
    Last edited by jscheuer1; 12-06-2007 at 01:48 PM. Reason: fix broken link to script

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,694
    Thanks
    43
    Thanked 3,132 Times in 3,096 Posts
    Blog Entries
    12

    Default

    There are two main issues here, the second one of which might not matter for you, depending upon your setup. Each of these have other considerations that go with them, they are:

    1 ) Once a slide show (there can be several on a page) initializes, it sets an internal variable to contain its images. So, changing the array that it was started with won't change the images it is using.

    2 ) Each slideshow writes to the page as it is loading, creating and styling the 3 HTML divisions it needs to function. If you replace this with Ajax, it needs to be recreated, or already exist in the imported content.

    If you are not replacing the slide show, but only other content on the page, and want to simultaneously change the array of images for the slide show, you only have to worry about #1 above.

    For that (#1), each slide show records its instance as:

    Code:
    fadearray[fadearray.length]=this
    which means that the first slide show (if you have only one it is the first) on a page will be:

    Code:
    fadearray[0]
    The second one will be:

    Code:
    fadearray[1]
    ans so on. Each show records its images as:

    Code:
    this.theimages=theimages
    So the first show's images are now kept track of in an array called:

    Code:
    fadearray[0].theimages
    It is this array you would want to replace in order to change that show's images.

    I did say that there were other considerations. This is a multi-dimensional array (an array containing arrays), each entry contains image source, link, and target. The easiest way to replace the array is with another one that you already have defined that resembles this one in structure.

    Another consideration is the image's dimensions. If the new set's are the same as the old set's, we don't need to worry about that.

    The last issue relating to #1 is preloading. The show preloaded its images as it was initializing. It placed the preloaded images in an array:

    Code:
    this.postimages=new Array() //preload images
    for (p=0;p<theimages.length;p++){
    this.postimages[p]=new Image()
    this.postimages[p].src=theimages[p][0]
    It is this array that the show will look to for the actual images. It will be:

    Code:
    fadearray[0].postimages
    You would need to preload the images from all possible additional arrays after the page has loaded and define them as this array at the same time that you change the other array, so that they will be available to the script when needed.

    Preloading takes as long as loading though, so don't go overboard with the number of images or their byte size.

    Now, I may have left something out (from #1, I did leave #2 hanging for the time being), hopefully not, and hopefully #2 won't be an issue with your setup. If you need more help:

    Please post a link to the page on your site that contains the problematic code so we can check it out.
    Last edited by jscheuer1; 12-06-2007 at 01:55 PM.
    - John
    ________________________

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

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
  •