Menu
I have been trying all morning to get this rotator to work…for some reason all it does is display the first picture and then nothing…the following is the code…I installed the script in the <head> as specified,
then the call in the body tag and directed the first image as I was supposed to do…
<img src=”images/slideshow1_1.jpg” name=’SlideShow’ width=250 height=188>
what am I doing wrong…?
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Step 1.
Put the following script in the head of your page:
<script>
// (C) 2000 [url]www.CodeLifter.com
// [url]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 = 5000
// 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’
// =======================================
// 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)
}
</script>
===========================================================
Step 2.
Put this onload event call in your body tag:
<body onload=”runSlideShow()”>
===========================================================
Step 3.
Put this in the body of your page where you want the
slide show to appear.
Set widths and heights same as images
Set image file same as first image in array Pic[] (above)
<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>
===========================================================