title: How to add a fade function to an existing slideshow script element
body: <p>I have the following script which initiates a slideshow on my website danmccready.com/Aviemore The problem that I am having is that the slides do change every 3 seconds but I want them to change with a gradual fading effect.  I have changed the crossFadeDuration variable with no joy. Any ideas, Thanks Dan     </p>
  
  <pre><code> // set the following variables
   // Set slideShowSpeed (milliseconds)
   var slideShowSpeed = 3000
  
   // Duration of crossfade (seconds)
   var crossFadeDuration = 1000
  
  
   // 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] = 'image1.jpg'
  
   }
  
   function runSlideShow(){
       if (document.all){
          document.images.SlideShow.style.filter="blendTrans(duration=2)"
          document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration=1000)"
          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 &gt; (p-1)) j=0
           t = setTimeout('runSlideShow()', slideShowSpeed)
       }
  </code></pre>