Problem updating Ultimate Fade SlideShow 1.5 to current 2.4

**elle34** · 03-15-2011, 11:44 AM

1) Script Title: Ultimate Fade in Slideshow

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

3) Describe problem: Please help

I installed this DD script 4 - 5 years ago on my website. Anytime the images stopped working in safari or firefox I would head back to DD and update some code. Now it's been a while and the pics dont show up in any browsers.

My problem is this. The previous versions of the script was so much more straightforward and I'm having trouble transitioning everything appropriately and it keeps messing up my site. This should be a simple fix so it is frustrating me, because the code looks similar, but the image listing formats are less intuitive, and it was unnecessary to change these elements in name only.

I want all the same settings, none of the additional features that were added. I just want it to show up in current browsers. Please help me.

here is what I had in various places, which used to work...

Code:

<script type="text/javascript">
/***********************************************
* Ultimate Fade-In Slideshow (v1.5): © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
 
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["(CGIVAR)images_path(/CGIVAR)/site/clouddog211.jpg","",""]
fadeimages[1]=["(CGIVAR)images_path(/CGIVAR)/site/splash.jpg", "http://www.roversallover.com/store/new.html",""]
fadeimages[2]=["(CGIVAR)images_path(/CGIVAR)/site/splash_hardy.jpg", "http://www.roversallover.com/store/cat/ed_hardy_dog.html",""]
fadeimages[3]=["(CGIVAR)images_path(/CGIVAR)/site/clouddog211.jpg","",""]
fadeimages[4]=["(CGIVAR)images_path(/CGIVAR)/site/redhydrant211.jpg", "http://www.roversallover.com/store/cat/accessories.html",""]
fadeimages[5]=["(CGIVAR)images_path(/CGIVAR)/site/splash_hardy.jpg", "http://www.roversallover.com/store/cat/ed_hardy_dog.html",""]

var fadeimages2=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["(CGIVAR)images_path(/CGIVAR)/site/rover_forum8.jpg", "http://www.roversallover.com/store/forum",""]
fadeimages2[1]=["(CGIVAR)images_path(/CGIVAR)/site/Grass_shiping75.jpg","http://www.roversallover.com/store/splash.html",""]
fadeimages2[2]=["(CGIVAR)images_path(/CGIVAR)/site/Grass_shiping7flat4.jpg","http://www.roversallover.com/store/specials.html",""]


var fadebgcolor="white"
 
////NO need to edit dynamic script beyond here/////////////

And the places that recall the slideshows:

ex. SLIDESHOW2:

Code:

          <tr>
            <td width="180" height="196"><script type="text/javascript">
//new fadeshow(fadeimages2, slideshow_width="180", slideshow_height="196", borderwidth=0, delay="10000", pause="1")
new fadeshow(fadeimages2, 180, 196, 0, 8000, 1)
new fadeshow(fadeimages21, 180, 196, 0, 8000, 1)
new fadeshow(fadeimages22, 180, 196, 0, 8000, 1)
new fadeshow(fadeimages23, 180, 196, 0, 8000, 1)
 
</script> </a></td>

          </tr>

**ddadmin** · 03-16-2011, 03:10 AM

Hmm we need to see the script in its entirety to pick out the issue. Please post a link to the page on your site that contains the problematic script so we can check it out.

**elle34** · 03-16-2011, 04:49 AM

http://www.roversallover.com/store/splash.html

There are 2 different DD Slideshows on this page that used to work. One in the top middle (Slideshow 1) is only on the splash page, and the other (Slideshow 2) is at the bottom of the left sidebar/left nav.

I put it back to the 1.5 version for the moment, which doesnt work either.

**ddadmin** · 03-16-2011, 07:00 AM

Looking at your page, there are quite a few things wrong. It seems you've merged parts of v1.5's code with v2.x's, which obviously won't work. The best way to go is still to just use the latest version of the script. I've done the work for you in importing your image definitions into the new script. The full complete result is:

Code:

<head>

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

<script type="text/javascript" src="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: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["http://www.roversallover.com/store/media/images/site/clouddog211.jpg","",""],
		["http://www.roversallover.com/store/media/images/site/splash.jpg", "http://www.roversallover.com/store/new.html",""],
		["http://www.roversallover.com/store/media/images/site/splash_hardy.jpg", "http://www.roversallover.com/store/cat/ed_hardy_dog.html",""],
		["http://www.roversallover.com/store/media/images/site/clouddog211.jpg","",""],
		["http://www.roversallover.com/store/media/images/site/redhydrant211.jpg", "http://www.roversallover.com/store/cat/accessories.html",""],
		["http://www.roversallover.com/store/media/images/site/splash_hardy.jpg", "http://www.roversallover.com/store/cat/ed_hardy_dog.html",""] //<--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: 500, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})


var mygallery2=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://www.roversallover.com/store/media/images/site/rover_forum8.jpg", "http://www.roversallover.com/store/forum",""],
		["http://www.roversallover.com/store/media/images/site/Grass_shiping75.jpg","http://www.roversallover.com/store/splash.html",""],
		["http://www.roversallover.com/store/media/images/site/Grass_shiping7flat4.jpg","http://www.roversallover.com/store/specials.html",""] //<--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"
})

</script>

</head>

<body>

<div id="fadeshow1"></div>

<br />

<div id="fadeshow2"></div>

<div id="fadeshow2toggler" style="width:250px; text-align:center; margin-top:10px">
<a href="#" class="prev"><img src="http://i31.tinypic.com/302rn5v.png" style="border-width:0" /></a>  <span class="status" style="margin:0 50px; font-weight:bold"></span> <a href="#" class="next"><img src="http://i30.tinypic.com/lzkux.png" style="border-width:0" /></a>
</div>

The parts in red are significant. Make sure fadeslideshow.js is present inside your webpage directory. Move the two DIVs to where you want the 1st slide show and 2nd slideshow to appear on your page, repectively.

**elle34** · 03-18-2011, 06:20 AM

I really appreciate your help!

I am very out out practice, so I have several questions:

1)What directory should I be putting fadeslideshow.js in? Should I find the java folder?

2) Is this all I have to put in the slideshow parameters?:
<div id="fadeshow1"></div> Because previously I had to put all that info (in above post)...

3) What is the code at the bottom for? If I dont need the toggle, do I have to put it in there still?

<div id="fadeshow2toggler" style="width:250px; text-align:center; margin-top:10px">
<a href="#" class="prev"><img src="http://i31.tinypic.com/302rn5v.png" style="border-width:0" /></a> <span class="status" style="margin:0 50px; font-weight:bold"></span> <a href="#" class="next"><img src="http://i30.tinypic.com/lzkux.png" style="border-width:0" /></a>
</div>

4) Also, do I still need to put the entire script in the header like before? Or is putting the js file in the directory what does it now?

**elle34** · 03-18-2011, 08:40 PM

Update:

Ok, so I found the folder that has my javascript files in it. I copied and pasted exactly what is displayed on this page:

http://www.dynamicdrive.com/dynamicindex14/fadeslideshow.js

>>>Do I need to add the code you provided above to the beginning of this file, or is it ok as is?? AND (visa versa), do I need to add the content of the entire js file in the header??

And I do still need input on questions 2 and 3 in my last reply...

I will keep messing around with things until I get feedback to see if I can maybe just figure it out through trial and error.

**elle34** · 03-18-2011, 09:14 PM

I also noticed that it says there must be 4 required fields each in the imagearray section in the 2.0 update, whereas there were only 3 in the 1.5 and earlier. (below is the example from the DD page)

Code:

An array containing the images you wish to show. Each array element contains 4 parts:

["path_to_image", "optional_url", "optional_linktarget", "optional_description"]

Enter a blank string ("") for the optional parts you do not wish to define. Here's a complete example:

...I noticed you had only put three. Is it ok this way? (see below for what you showed me)

Code:

["http://www.roversallover.com/store/media/images/site/rover_forum8.jpg", "http://www.roversallover.com/store/forum",""],
		["http://www.roversallover.com/store/media/images/site/Grass_shiping75.jpg","http://www.roversallover.com/store/splash.html",""],
		["http://www.roversallover.com/store/media/images/site/Grass_shiping7flat4.jpg","http://www.roversallover.com/store/specials.html",""]

Thread: Problem updating Ultimate Fade SlideShow 1.5 to current 2.4

Thread Tools

Search Thread

Problem updating Ultimate Fade SlideShow 1.5 to current 2.4

Bookmarks

Bookmarks

Posting Permissions