CodeLifter.com - JavaScript Cross-Browser SlideShow Script with Image Cross-Fade

===========================================================
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
Author:   etLux
===========================================================

Step 1.
Put the following script in the head of your page:

// =======================================
// 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)

===========================================================

Get The Code!

CodeLifter is a CodeBrain.com Sister Site
�1995 - 2012 OEC Corp & CodeLifter.com
CodeLifter� & CodeBrain�
Legal Notices

CodeBrain InterNET Group
BrainCode.com	CodeFoot.com	CodeBelly.com
Droiddd.com	etLux.com	FFFast.com
TrayApps.com	PopUpWorks.com	MicroTicker.com
DavidSosnowski.com	OECCorp.com	MailToProtector.com
	CodeBrain.com

Free MUSIC!

Contemporary classical music, completely free.