two slideshows on one site?

[handcrafteduk]

1) Script Title: Ultimate Fade in Slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem: I have this brilliant script working on my website.

However, I am wanting to add a second slideshow to a different page on the site. If I use the tag <div id="fadeshow4"></div> it does not work. It seems the script needs to cycle through fadeshows 1, 2 and, 3 first.

Is there anything I can add to my page to get this fadeshow 4 to display?

Many thanks,

Gary Mullen
HandcraftedUK

[jscheuer1]

It doesn't. You do need to use the same wrapperid in the on page declaration as you use for the id of the div tag. So in the head:


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow4", //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.tinypi . . .

and later in the body:


<div id="fadeshow4"></div>

If you want more help:

Please post a link to a page on your site that contains the problematic code so we can check it out.

[handcrafteduk]

Thank you very much.

Yes, I have this coded and also have placed it in to the html_header on my site.

If I place the codes for fadeshows 1-4 on a page it works.

If I place only <div id="fadeshow4"></div> onto a page nothing shows. I have placed the code on this (http://www.handcrafteduk.com/ethnicgiftspeacockfeathers-c-3_46.html) page.


Thanks again,

Gary :)

[jscheuer1]

Get rid of all of this:


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [160, 160], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["https://www.handcrafteduk.com/images/african/africa1.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsafricandrums-c-4_24_76.html", "", ""],
["https://www.handcrafteduk.com/images/african/africa2.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsafricandrums-c-4_24_76.html", "", ""],
["https://www.handcrafteduk.com/images/african/africa3.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsafricandrums-c-4_24_76.html", "",""]
],

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false, randomize:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 1000, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
dimensions: [160, 160], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["https://www.handcrafteduk.com/images/indian/indian1.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindiandrums-c-4_24_77.html", "", ""],
["https://www.handcrafteduk.com/images/indian/indian2.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindiandrums-c-4_24_77.html", "", ""],
["https://www.handcrafteduk.com/images/indian/indian3.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindiandrums-c-4_24_77.html", "",""]
],

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false, randomize:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 1000, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow3", //ID of blank DIV on page to house Slideshow
dimensions: [160, 160], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["https://www.handcrafteduk.com/images/indonesian/bali1.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "", ""],
["https://www.handcrafteduk.com/images/indonesian/bali2.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "", ""],
["https://www.handcrafteduk.com/images/indonesian/bali3.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "",""]
],

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false, randomize:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 1000, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})

Keep this:


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow4", //ID of blank DIV on page to house Slideshow
dimensions: [300, 70], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["https://www.handcrafteduk.com/images/articleimages/thismorning.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "", ""],
["https://www.handcrafteduk.com/images/articleimages/peacockbanner2.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "", ""],
],

displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false, randomize:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 1000, //transition duration (milliseconds)
descreveal: "always",
togglerid: ""
})

But inside of it, get rid of the trailing comma for the last entry in the imagearray:


. . nner2.jpg", "http://www.handcrafteduk.com/bongoanddjembedrumsindonesiandrums-c-4_24_78.html", "", ""],