PDA

View Full Version : Ultimate Fade In Slideshow v2.0-



Graeme
03-11-2014, 06:04 PM
Hello All,

First timer here, not too sure if I'm in the right forum!

I'm trying to code the Ultimate Fade In Slideshow v2.0- but I think I have problems with the paths of the images. Do the paths http://www.dynamicdrive.com/dynamicindex4/pool.jpg" use dd.com's images for testing? I also have a temp folder into which I'm saving everything and I have the .js file in there is this also correct for now?

Thank you,

Best wishes
Graeme

jscheuer1
03-11-2014, 08:18 PM
You cannot hotlink to the images on the Dynamic Drive server. Well you can, but they will not show up most of the time.

Graeme
03-11-2014, 09:14 PM
You cannot hotlink to the images on the Dynamic Drive server. Well you can, but they will not show up most of the time.
thank you, shall i just use some images locally on my pc for testing? also, can i ask i'm using this to replace a flash banner with dimensions of 921x 200, do the images i use need to be this size also,
many thanks,
graeme

jscheuer1
03-12-2014, 09:12 PM
Yes and yes.

A little more info:

When testing locally, you can use local images. Once the page is live, you probably need to upload your images to your server even for testing, and definitely need to upload them for others to be able to see them.

Graeme
03-21-2014, 06:56 PM
Hello again,

How can I increase the pause time for each image please?

Thank you

jscheuer1
03-21-2014, 08:10 PM
There are two places in the configuration where that's involved:




<script type="text/javascript">

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://www.dynamicdrive.com/dynamicindex4/pool.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://www.dynamicdrive.com/dynamicindex4/cave.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://www.dynamicdrive.com/dynamicindex4/fruits.jpg"],
["http://www.dynamicdrive.com/dynamicindex4/dog.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:2000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

</script>

as highlighted in a sample configuration (above). The displaymode pause is how long each image is seen for. That's the main one and is really the answer to your question. The transition duration (fadeduration) is how long it takes for an image to fade in. The fadeduration should always be less than the pause. Otherwise it will never allow any of the images to fully fade in before they start to change to the next one.

Both of these are set in milliseconds. 1000 equals one second.

Graeme
03-21-2014, 11:54 PM
thank you john, amazing help, all the best to you,
graeme