Results 1 to 2 of 2

Thread: Help needed with Ultimate Fade in Slideshow

  1. #1
    Join Date
    Mar 2010
    Posts
    22
    Thanks
    6
    Thanked 1 Time in 1 Post

    Post Help needed with Ultimate Fade in Slideshow

    1) Script Title: ultimate fade in slideshow

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

    3) Describe problem: Hi all
    I'm new to javascript.

    all I want is to use this script. but instead of the desc overlapping my image i want it to come to the right of the image.
    I want 2 tables on which shud have the images and the other one which ahs the description. and both shud be timed together.
    I hope this is making sense.
    Plz Help

  2. #2
    Join Date
    Aug 2004
    Posts
    9,885
    Thanks
    3
    Thanked 962 Times in 951 Posts
    Blog Entries
    15

    Default

    Sure, try this. In the configuration code for the slideshow (of your head section), try the following changes:

    Code:
    var mydesc=[
    "desc 1",
    "desc 2",
    "desc 3",
    "desc 4",
    ]
    
    var mygallery=new fadeSlideShow({
    	wrapperid: "fadeshow2", //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:'manual', pause:2500, cycles:0, wraparound:false},
    	persist: false, //remember last viewed slide and recall within same session?
    	fadeduration: 500, //transition duration (milliseconds)
    	descreveal: "always",
    	togglerid: "fadeshow2toggler",
    	onslide:function(img, index){
    		document.getElementById('descdiv').innerHTML=mydesc[index]
    	}
    })
    Firstly, notice the custom array you should create to store the descriptions for each slide. The descriptions inside the
    Code:
    imagearray[]
    should be removed at the same time. Then, define the onslide() event handler in the manner above, which populates the empty DIV with ID="descdiv" on your page with the corresponding description for each slide. Be sure to change "descdiv" depending on the ID of your DIV.
    DD Admin

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
  •