multipule slide shows on one page

shawntbanks · Mar 16, 2004

Below is the code that I am trying to use to put two slide shows on one page, but I can't seem to get it to work, does anyone have any ideas

<HTML>
<HEAD>
<TITLE>homepage</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<script language="JavaScript">

// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 2000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// 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'

var t
var j = 0
var p = Pic.length

var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad = new Image()
preLoad.src = Pic
}

function runSlideShowa(){
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)
}
</script>
<script language="JavaScript">

// =======================================
// set the following variables
// =======================================

// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 2000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// 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'

var t
var j = 0
var p = Pic.length

var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad = new Image()
preLoad.src = Pic
}

function runSlideShowb(){
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)
}
</script>
</HEAD>
<BODY BGCOLOR=#FFFFFF LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 onload="runSlideShowa();runSlideShowb()">

<TABLE WIDTH=800 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=4>
<IMG SRC="images/Top_of_page.gif" WIDTH=800 HEIGHT=143 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=4> 
</TD>
</TR>
<TR>
<TD ROWSPAN=3>
<IMG SRC="images/Left_side.gif" WIDTH=415 HEIGHT=362 ALT=""></TD>

<td id="VU" width="160" height="160">
<img src="1.jpg" name='SlideShowa' width="160" height="160"></td>
<td id="VU" width="160" height="160">
<img src="2.jpg" name='SlideShowb' width="160" height="160"></td>

<TD ROWSPAN=3>
<IMG SRC="images/homepage2_05.gif" WIDTH=65 HEIGHT=362 ALT=""></TD>
</TR>
<TR>
<TD>
<IMG SRC="images/homepage2_06.gif" WIDTH=160 HEIGHT=160 ALT=""></TD>
<TD>
<IMG SRC="images/homepage2_07.gif" WIDTH=160 HEIGHT=160 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=2 WIDTH=320 HEIGHT=42> 
</TD>
</TR>
</TABLE>

</BODY>
</HTML>

adam0101 · Mar 16, 2004

Well, one problem I see is that you need to change this line:

Code:

t = setTimeout('runSlideShow()', slideShowSpeed)

to say 'runSlideShowa()' or 'runSlideShowb()' in each of your functions. Another problem is that you need one of your functions to use a timer variable other than "t". Otherwise one function is going to overwrite the other.

Adam
while(ignorance){perpetuate(violence,fear,hatred);life=life-1};

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

multipule slide shows on one page

shawntbanks

Programmer

adam0101

Programmer

Similar threads

Part and Inventory Search

Sponsor