PDA

Click to See Complete Forum and Search --> : using 2 lots of javascript on one page?

little_lisa
01-13-2004, 01:59 PM
I am going to use the below script for a fading image slideshow. Problem is I would like more than one slideshow on one page, each slideshow is to include different pictures.
How do I alter or add to the script to run more than one of these scripts at the same time??

Thanx
Lisa

<!-- THREE STEPS TO INSTALL FADING SLIDE SHOW:

1. Copy the coding into the HEAD of your HTML document
2. Add the onLoad event handler into the BODY tag
3. Put the last coding into the BODY of your HTML document -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: CodeLifter.com (support@codelifter.com) -->
<!-- Web Site: http://www.codelifter.com -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 3;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
// End -->
</script>

</HEAD>

<!-- STEP TWO: Insert the onLoad event handler into your BODY tag -->

<BODY onLoad="runSlideShow()">

<!-- STEP THREE: Copy this code into the BODY of your HTML document -->

<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150>
</td>
</tr>
</table>

<p><center>
<font face="arial, helvetica" size"-5">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size: 2.13 KB -->
JeanNick
01-13-2004, 02:14 PM
To be simple, you could add this script has many times as needed in your page. For sure it would not be a "clean" solution for it is opposite to many programming methods.

However, if you still do it that way, you may want to use tables to organise your slideshows in your pages.

Another way would be to rewrite the script in order to make a kind of class of it and then, instanciate objects that class as many times as you need slideshows.

Even if the script is light and all, you may have a performance issue if your pictures are big. If so, you should consider having one slideshow per page..
little_lisa
01-13-2004, 03:14 PM
I have tried to use this script more than once. The first script does not work once the second script is added.