PDA

View Full Version : Ultimate Fade-in slideshow: code not working



adfy
04-02-2010, 08:11 PM
I'm using the slideshow in two ways, one on the home page, another in the left sidebar.

in the left sidebar area, the 2nd widget with the rotating flyers, it works on the home page, but not on any other pages:
http://alldesignedforyou.com/whiskey/

Thanks ahead of time.

I used this code: http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm


<script type="text/javascript">




var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg1.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg2.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg3.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg4.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg5.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg6.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg7.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg8.png"]
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
dimensions: [200, 262], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/04/widget-flyer1.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/04/widget-flyer2.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/04/widget-flyer3.png"]
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

</script>

jscheuer1
04-02-2010, 09:54 PM
Using:



var mygallery=

twice is a bad idea, but the source code on the menu page shows that you are not doing that there. One issue there is that there is no division with the id 'fadeshow1', so that is causing an error. Either make one or get rid of:


var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg1.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg2.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg3.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg4.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg5.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg6.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg7.png"],
["http://alldesignedforyou.com/whiskey/wp-content/uploads/2010/03/fg8.png"]
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

for that page.

I also see that you've included jQuery twice on that page, once here:


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

and again here:


<script type='text/javascript' src='http://alldesignedforyou.com/whiskey/wp-includes/js/jquery/jquery.js?ver=1.3.2'></script>

Since you are obviously hosting this script, I'd stick with the second one, but move it to where the first one is. There might be a problem for the later code that uses jQuery then though. If so remove:


jQuery.noConflict()

from near the beginning of the fadeslideshow.js file.

There could also be other problems.