Ultimate Fade-in slideshow (v1.51)

[ChasDevlin]

1) Ultimate Fade-in slideshow (v1.51):

2) http://www.dynamicdrive.com/dynamici...nslideshow.htm

3) How to overlap two seperate slideshows:

-- Many thanks for the updates. This has been a very useful script.

However, is it possible to have two slideshows that completely overlap each other? I have the body code in a table (I know, I know!), and it simply puts one slideshow beneath the other.

I haven't attempted it with CSS positioning.

Also, would it know to complete one slideshow, before starting the next one (that sits over it)?

Thanks

[jscheuer1]

Something like that could probably be done the way that you are proposing. However, there may well be an easier way. What two slide shows do you want/have in mind? Anyways, it would probably be easier to have one slide show. If you want some of the images removed from it/ignored once those images have been shown once, that would be easier to code.

So you could have for example (first time through):

1,2,3,4,5,6,7,8

Then, each time after 8 is shown, it goes back to 4 and continues from there.

The script code changes would be minimal and there would be no complex layout gymnastics to go through. On the other hand, using layout would still also require script code changes, perhaps more involved ones at that.

[ChasDevlin]

John,

Thanks for the reply. Actually, you're right... one constant slideshow with a multitude of banners would get the job done. On my site however, I run the slideshows to advertise various things (all different), so having them run together looks kinda weird.

I think what I really wanted, was to have a 'rotating' slideshow. That is, seperate slideshows where one is activated at set moments -- like a traditional rotating banner script -- either on page refresh, or day of the week etc.

I know that's an entire rewrite, which I'm not proposing!

Of course, I can grab a rotating banner script and animate the banners, but the slideshow effect is more appealing

[jscheuer1]

I think what I really wanted, was to have a 'rotating' slideshow. That is, seperate slideshows where one is activated at set moments -- like a traditional rotating banner script -- either on page refresh, or day of the week etc.

That seems easy enough. The script already allows for several arrays to be set (from the demo):

var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax
 
var fadeimages2=new Array() //2nd array set example. Remove or add more sets as needed.
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["photo1.jpg", "", ""] //plain image syntax
fadeimages2[1]=["photo2.jpg", "http://www.cssdrive.com", ""] //image with link syntax
fadeimages2[2]=["photo3.jpg", "http://www.javascriptkit.com", "_new"] //image with link and target syntax

After those, you could make a new array of the arrays:

var shows=[];
shows[0]=fadeimages;
shows[1]=fadeimages2;

Add as many arrays of images to that array as you like, as long as they exist (are defined) above it in the code as in the above example.

Next, say you want a random show, do (right after the above):

shows.sort(function() {return 0.5 - Math.random();})

Now in the body part of the code, have:

<script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(shows[0], 140, 225, 0, 3000, 1, "R")
 
</script>

A similar thing could be done to get a day of the week show, assuming you have 7 shows, skip the part:

shows.sort(function() {return 0.5 - Math.random();})

and in the body:

<script type="text/javascript">
//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(shows[new Date().getDay()], 140, 225, 0, 3000, 1, "R")
 
</script>

[ChasDevlin]

Thanks John,

I'm gonna play around with your suggestions and see what happens.

Many thanks...

[ChasDevlin]

Oddly enough... it all seemed to work when testing it locally, but once uploaded, I got an error: 'shows is undefined'.

I meticulously stuck to the code, but something went awry!

I had two slideshows -- the first with 2 images, the second with 4 (if that makes a difference).

The .js code was:

var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]=["images/banner1.jpg", "http://link1", "_blank"] 
fadeimages[1]=["images/banner2.jpg", "http://link2", "_blank"] 

var fadeimages2=new Array() //2nd array set example. Remove or add more sets as needed.
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages2[0]=["images/banner1.jpg", "http://link1", "_blank"] 
fadeimages2[1]=["images/banner2.jpg", "http://link2", "_blank"] 
fadeimages2[2]=["images/banner3.jpg", "http://link3", "_blank"] 
fadeimages2[3]=["images/banner4.jpg", "http://link4", "_blank"] 


var shows=[];
shows[0]=fadeimages;
shows[1]=fadeimages2;

shows.sort(function() {return 0.5 - Math.random();})

the Body code was:

//new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder)
new fadeshow(shows[0], 140, 225, 0, 3000, 1)

Even after playing around with using 0 or 1 in the

new fadeshow(shows[1],

bit, it still worked locally.

Not a life + death situation... I'll play around with it again.

[jscheuer1]

Oddly enough... it all seemed to work when testing it locally, but once uploaded, I got an error: 'shows is undefined'.

That is odd. Unless something (like your editor) changed the code when it got uploaded, or your server added a conflicting script, that shouldn't have happened. It really doesn't matter (with the setup from your previous post) whether you use shows[1] or [0]. If you had more shows, you could use any of the valid shows numbers. It would still be a random show, as the entire shows array is being shuffled.

If you keep having trouble with your live page, a link to it would help me spot the problem.

[ChasDevlin]

The sweet smell of success!

Even though I'm using the same exact previous code (as far as I can tell), it does now work

Your help was much appreciated. Thanks!