PDA

View Full Version : Calling one of many slideshows with Ultimate Fade-in Slideshow



Wootastic
11-15-2010, 04:30 PM
1) Script Title:
Ultimate Fade-in slideshow (v2.4)

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

3) Describe problem:
The script will not display slideshows for defined 'fadeslideshows' if other defined slideshows are not called on the page via DIV.

For example: If I define 3 'fadeslideshows', title 'show1', 'show2' and 'show3' and try to call only 'show3' it fails. If I call 'show1' and 'show2' on the same page, then 'show3' will work.

How do I define multiple slideshows for use across the page (using Wordpress and placing the 'mygallery' calls in Header) and still be able to only display certain slideshows on each page?


Thank you!!

Wootastic
11-15-2010, 06:41 PM
Here is what I am using in my header:



<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="http://skincareinmukilteo.com/fadeslideshow.js">

/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [246, 260], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/MasterBA/AC_Before1.jpg", "http://skincareinmukilteo.com/acne-clearance/how-it-works/", "", "Acne Clearance - Click for more info"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/MasterBA/AC_After1.jpg", "http://skincareinmukilteo.com/acne-clearance/how-it-works/", "", "Acne Clearance - Click for more info"] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 600, //transition duration (milliseconds)
descreveal: "peekaboo",
togglerid: ""
})

</script>


<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "hremoval", //ID of blank DIV on page to house Slideshow
dimensions: [481, 252], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/hairremoval/HR_BA1.jpg ", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/hairremoval/HR_BA2.jpg ", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/hairremoval/HR_BA3.jpg ", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/hairremoval/HR_BA4.jpg ", "", "", "Skin Care in Mukilteo"] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:3000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 600, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "acneba", //ID of blank DIV on page to house Slideshow
dimensions: [481, 252], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/acne/AC_BA1.jpg", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/acne/AC_BA2.jpg", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/acne/AC_BA3.jpg", "", "", "Skin Care in Mukilteo"],
["http://skincareinmukilteo.com/wp-content/uploads/beforeandafter/acne/AC_BA4.jpg", "", "", "Skin Care in Mukilteo"] //<--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: 600, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

</script>

And here are the pages:

In this page you can see that 'fadeshow1' (in the sidebar) and 'hremoval' slideshows are being called (via DIV) and successfully displayed.

http://skincareinmukilteo.com/hair-removal/hair-removal-before-and-after-pictures/

In the following page, 'fadeshow1' is properly displaying in the sidebar, but 'acneba' is not (in the main page):

http://skincareinmukilteo.com/acne-clearance/before-and-after-pictures/




I also created this test page where 'fadeshow1' is again in the sidebar, and 'hremoval' and 'acneba' are properly displayed in the main page:


http://skincareinmukilteo.com/slideshow-test/



I would like to be able to show one or two slideshows per page with Wordpress. Right now building multiple slideshows with 'mygallery' is not working since the script stops if it does not find a DIV in the list on a particular page.

Wootastic
11-15-2010, 07:10 PM
I found a workaround using this plug-in: http://lud.icro.us/wordpress-plugin-head-meta/

It allows me to add the specific 'mygallery' info to each page on my Wordpress site so I never run into the issue of having a gallery defined that is not being used on the page (via DIV).