Results 1 to 6 of 6

Thread: Need help with configuring Slideshow

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

    Default Need help with configuring Slideshow

    1) Script Title: Ultimate Fade-in slideshow (v1.51)

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

    3) Describe problem: No pictures

    Could someone give me an example of how to configure Ultimate Fade-in slideshow using my directory? Help much appreciated!

    My test pictures are in this directory... http://oddjobconnect.com/slideshow/
    My slideshow test page is here... http://www.oddjobconnect.com/dynamictest.htm
    Last edited by K_Os; 10-29-2007 at 03:37 PM.

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    the contents of the first coding box is what you need to edit to configure the script accordingly. you need to decide what you features you wish to incorporate. there are a couple of parameters. below is the template
    Code:
    fadeimages[n] = ["image","link","target"];
    where
    n = where in the slideshow you want something to appear.
    eg 1,2,3 etcetc
    image = url path to the image.
    you can use either an absolute path ( http://www.mydomain.com/image.jpg )
    or a relative path ( image.jpg ) if the script is running in the same folder as the image

    -- optional --
    link = if you want the image to link to somewhere this is where you put in the url
    target = where you want the link to appear, default is in the current window


    if you have any specific questions let us know.

  3. #3
    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

    First of all, your images are of different dimensions, use:

    http://www.dynamicdrive.com/dynamici...army/index.htm

    instead. It can accommodate images of varying dimensions. As far as how you would setup the current script to find the images you do have, it would look like so:

    Code:
    var fadeimages=new Array()
    //SET IMAGE PATHS. Extend or contract array as needed
    fadeimages[0]=["slideshow/1.jpg", "", ""] //plain image syntax
    fadeimages[1]=["slideshow/2.jpg", "", ""] //plain image syntax
    fadeimages[2]=["slideshow/3.jpg", "", ""] //plain image syntax
    fadeimages[3]=["slideshow/4.jpg", "", ""] //plain image syntax
    fadeimages[4]=["slideshow/5.jpg", "", ""] //plain image syntax
    Use that instead of:

    Code:
    var fadeimages=new Array()
    //SET IMAGE PATHS. Extend or contract array as needed
    slideshow[0]=["1.jpg", "2.jpg", "3.jpg","4.jpg","5.jpg"] //plain image syntax
    fadeimages[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
    fadeimages[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax
    Get rid of this:

    Code:
    var fadeimages2=new Array() //2nd array set example. Remove or add more sets as needed.
    //SET IMAGE PATHS. Extend or contract array as needed
    fadeimages2[0]=["photo1.jpg", "", ""] //plain image syntax
    fadeimages2[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
    fadeimages2[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax
    And later, get rid of the red part:

    Code:
    <script type="text/javascript">
    //new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
    new fadeshow(fadeimages, 140, 225, 0, 3000, 1, "R")
    new fadeshow(fadeimages2, 140, 225, 0, 3000, 0)
     
    </script>
    The dimensions (140 and 225) would need to be adjusted because your images are bigger (533 and 400 would look to be about right), but that's where having images of varying dimensions would mess up this show, they will not all appear in the same spot, no matter how you adjust the width and height.

    Important! Optimize your images.
    - John
    ________________________

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

  4. #4
    Join Date
    Oct 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    John, thanks, that was a big help.

    I got it to work on the test page here with your suggestions...
    http://www.oddjobconnect.com/dynamictest.htm

    But when I copy the code to my homepage I doesn't work...
    Homepage: http://www.oddjobconnect.com/chathome.htm

    Can it go inside a table cell?

  5. #5
    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

    It can go in a table cell, but that might not get you what you think it may. To get the images to align center and valign middle, you need:

    http://www.dynamicdrive.com/dynamici...army/index.htm

    There is a coding flaw in the script you are using that only comes into play in certain browsers and certain situations. It is a problem on your page in IE. Find this line in the script:

    Code:
    for (p=0;p<theimages.length;p++){
    Change it to:

    Code:
    for (var p=0;p<theimages.length;p++){
    Also, this:

    Code:
    <script language="JavaScript1.2" fptype="dynamicanimation" src="file:///C:/Program%20Files/Microsoft%20Office/Office10/fpclass/animate.js">
    </script>
    should be removed from the live page.
    - John
    ________________________

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

  6. #6
    Join Date
    Oct 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks again! Got it working

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
  •