jquery - How do I add a fade effect to this slideshow? -

i have slideshow here love give fade effect. not sure how it, not familiar javascript, know how copy , paste code ( make mistakes) page here: http://lazlo.us/bw/getimages.html

i using php script pull images directory create slideshow.

the javascript creates slideshow straightforward ( found on the net):

var curimg = 0; function rotateimages() {     document.getelementbyid("slideshow").setattribute("src", "" + galleryarray[curimg]);     curimg = (curimg<galleryarray.length - 1)? curimg + 1 : 0; }  window.onload = function() {     setinterval("rotateimages()", 3500); } 

anyone me put fade effect it?

lazlo

instead of updating src of image, you'll need insert second element, , fade in.

here's simple fiddle threw uses css handle transitions on opacity.

basically, will:

1. create image element
2. insert before existing image element
3. wait 100ms, , set opacity of old image 0

an image preloader helpful kick off animation well. luck!