jamie smith
04-06-2005, 11:39 AM
Hi
Iv adapted a slideshow script so that it appears twice on the same page. It works but I want to put a start delay on one of the slideshows to make the images change in sequance. Does anyboody know the bit of code I need to do it?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully
// =======================================
// set the following variables
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 3000
var slideShowSpeed2 = 3000
// Duration of crossfade (seconds)
var crossFadeDuration = 3
// Specify the image files
var Pic = new Array()
var Pic2 = new Array()
Pic[0] = 'pic/bcn1.jpg'
Pic[1] = 'pic/bcn2.jpg'
Pic[2] = 'pic/bcn3.jpg'
Pic[3] = 'pic/bcn4.jpg'
Pic2[0] = 'pic/bcn1.jpg'
Pic2[1] = 'pic/bcn2.jpg'
Pic2[2] = 'pic/bcn3.jpg'
Pic2[3] = 'pic/bcn4.jpg'
// =======================================
// do not edit anything below this line
// =======================================
var k = 0
var t
var j = 0
var p = Pic.length
var p2 = Pic2.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
var preLoad2 = new Array()
for (i = 0; i < p2; i++){
preLoad2[i] = new Image()
preLoad2[i].src = Pic2[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)
}
function runSlideShow2(){
if (document.all){
document.images.SlideShow2.style.filter="blendTrans(duration=2)"
document.images.SlideShow2.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow2.filters.blendTrans.Apply()
}
document.images.SlideShow2.src = preLoad2[k].src
if (document.all){
document.images.SlideShow2.filters.blendTrans.Play()
}
k = k + 1
if (k > (p2-1)) k=0
t = setTimeout('runSlideShow2()', slideShowSpeed2)
}
</script>
</head>
<body onload="runSlideShow(); runSlideShow2()">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=220 width=330>
<img src="1.jpg" name='SlideShow' width=330 height=220></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=220 width=330>
<img src="1.jpg" name='SlideShow2' width=330 height=220></td>
</tr>
</table>
</body>
</html>
thankyou
Iv adapted a slideshow script so that it appears twice on the same page. It works but I want to put a start delay on one of the slideshows to make the images change in sequance. Does anyboody know the bit of code I need to do it?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully
// =======================================
// set the following variables
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 3000
var slideShowSpeed2 = 3000
// Duration of crossfade (seconds)
var crossFadeDuration = 3
// Specify the image files
var Pic = new Array()
var Pic2 = new Array()
Pic[0] = 'pic/bcn1.jpg'
Pic[1] = 'pic/bcn2.jpg'
Pic[2] = 'pic/bcn3.jpg'
Pic[3] = 'pic/bcn4.jpg'
Pic2[0] = 'pic/bcn1.jpg'
Pic2[1] = 'pic/bcn2.jpg'
Pic2[2] = 'pic/bcn3.jpg'
Pic2[3] = 'pic/bcn4.jpg'
// =======================================
// do not edit anything below this line
// =======================================
var k = 0
var t
var j = 0
var p = Pic.length
var p2 = Pic2.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
var preLoad2 = new Array()
for (i = 0; i < p2; i++){
preLoad2[i] = new Image()
preLoad2[i].src = Pic2[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)
}
function runSlideShow2(){
if (document.all){
document.images.SlideShow2.style.filter="blendTrans(duration=2)"
document.images.SlideShow2.style.filter="blendTrans(duration=crossFadeDuration)"
document.images.SlideShow2.filters.blendTrans.Apply()
}
document.images.SlideShow2.src = preLoad2[k].src
if (document.all){
document.images.SlideShow2.filters.blendTrans.Play()
}
k = k + 1
if (k > (p2-1)) k=0
t = setTimeout('runSlideShow2()', slideShowSpeed2)
}
</script>
</head>
<body onload="runSlideShow(); runSlideShow2()">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=220 width=330>
<img src="1.jpg" name='SlideShow' width=330 height=220></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=220 width=330>
<img src="1.jpg" name='SlideShow2' width=330 height=220></td>
</tr>
</table>
</body>
</html>
thankyou