Hello all,
Well, I have this Dynamic Drive fade in slideshow script as an alternative to Flash on my homepage. For a long time it seemed to work just fine on everything except Opera...
Recently I downloaded Mozilla 1.6 for my mac, and boom... no working slideshow. It only displays the second pic of three, with no fade, and no other images, although it does seem to cycle. The funny thing is the script works fine in Netscape.
Any ideas? I'm a complete idiot when it comes to javascript, so any help is greatly appreciated... here's the code:
And here's the link:
richardmedek.com
Thanks,
-Rich
<edit>
Also just checked this script on Safari (does the same thing...) and Camino, Moz's OS X browser. In Camino, it works.
</edit>
Well, I have this Dynamic Drive fade in slideshow script as an alternative to Flash on my homepage. For a long time it seemed to work just fine on everything except Opera...
Recently I downloaded Mozilla 1.6 for my mac, and boom... no working slideshow. It only displays the second pic of three, with no fade, and no other images, although it does seem to cycle. The funny thing is the script works fine in Netscape.
Any ideas? I'm a complete idiot when it comes to javascript, so any help is greatly appreciated... here's the code:
Code:
<!-- start //Fade-in image slideshow- By Dynamic Drive //For full source code and more DHTML scripts, visit [url]http://www.dynamicdrive.com[/url] var slideshow_width='700px' var slideshow_height='150px' var pause=8000 var fadeimages=new Array() fadeimages[0]="imgs/slide1.jpg" fadeimages[1]="imgs/slide2.jpg" fadeimages[2]="imgs/slide3.jpg" var preloadedimages=new Array() for (p=0;p<fadeimages.length;p++){ preloadedimages[p]=new Image() preloadedimages[p].src=fadeimages[p] } var ie4=document.all var dom=document.getElementById if (ie4||dom) document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>') else document.write('<img name="defaultslide" src="'+fadeimages[0]+'">') var curpos=10 var degree=10 var curcanvas="canvas0" var curimageindex=0 var nextimageindex=1 function fadepic(){ if (curpos<100){ curpos+=2 if (tempobj.filters) tempobj.filters.alpha.opacity=curpos else if (tempobj.style.MozOpacity) tempobj.style.MozOpacity=(curpos*.01)-.01; } else{ clearInterval(dropslide) nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">' nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0 setTimeout("rotateimage()",pause) } } function rotateimage(){ if (ie4||dom){ resetit(curcanvas) var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.style.zIndex++ var temp='setInterval("fadepic()",50)' dropslide=eval(temp) curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" } else document.images.defaultslide.src=fadeimages[curimageindex] curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0 } function resetit(what){ curpos=10 var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) if (crossobj.filters) crossobj.filters.alpha.opacity=curpos else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=curpos/100 } function startit(){ var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">' rotateimage() } if (ie4||dom) startit() else setInterval("rotateimage()",pause) // -->
richardmedek.com
Thanks,
-Rich
<edit>
Also just checked this script on Safari (does the same thing...) and Camino, Moz's OS X browser. In Camino, it works.

</edit>