Jump to content

Javascript slideshow not working in IE


jp612

Recommended Posts

I created a javascript slideshow on my homepage and i tested it in opera, firefox, safari and chrome and it works perfectly there.

 

But its not working in any version of IE. I tested 8 and 7.

 

this is my code

var slideshow_width='841px' //SET IMAGE WIDTH

var slideshow_height='225px' //SET IMAGE HEIGHT

var pause=7000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)



var fadeimages=new Array()

//SET 1) IMAGE PATHS, 2) optional link, 3), optional link target:

fadeimages[0]=["js/homepage-slideshow/website-design.jpg", "", ""] //plain image syntax

fadeimages[1]=["js/homepage-slideshow/graphic-design.jpg", "", ""] 

fadeimages[2]=["js/homepage-slideshow/no-problem.jpg", "", ""] 



////NO need to edit beyond here/////////////



var preloadedimages=new Array()

for (p=0;p<fadeimages.length;p++){

preloadedimages[p]=new Image()

preloadedimages[p].src=fadeimages[p][0]

}



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;visibility: hidden"></div></div>')

else

document.write('<img name="defaultslide" src="'+fadeimages[0][0]+'">')



var curpos=10

var degree=10

var curcanvas="canvas0"

var curimageindex=0

var nextimageindex=1



function fadepic(){

if (curpos<100){

curpos+=10

if (tempobj.filters)

tempobj.filters.alpha.opacity=curpos

else if (tempobj.style.MozOpacity)

tempobj.style.MozOpacity=curpos/101

}

else{

clearInterval(dropslide)

nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"

tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)

tempobj.innerHTML=insertimage(nextimageindex)

nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0

var tempobj2=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)

tempobj2.style.visibility="hidden"

setTimeout("rotateimage()",pause)

}

}



function insertimage(i){

var tempcontainer=fadeimages[i][1]!=""? '<a href="'+fadeimages[i][1]+'" target="'+fadeimages[i][2]+'">' : ""

tempcontainer+='<img src="'+fadeimages[i][0]+'" border="0">'

tempcontainer=fadeimages[i][1]!=""? tempcontainer+'</a>' : tempcontainer

return tempcontainer

}



function rotateimage(){

if (ie4||dom){

resetit(curcanvas)

var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)

crossobj.style.zIndex++

tempobj.style.visibility="visible"

var temp='setInterval("fadepic()",50)'

dropslide=eval(temp)

curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"

}

else

document.images.defaultslide.src=fadeimages[curimageindex][0]

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/101

}



function startit(){

var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)

crossobj.innerHTML=insertimage(curimageindex)

rotateimage()

}



if (ie4||dom)

window.onload=startit

else

setInterval("rotateimage()",pause)

 

Im a little confused since it works well everywhere else but is there some IE issue thats causing the trouble?

 

Its at the bottom of the homepage.

www.debesdesign.com

Link to comment
Share on other sites

  • 2 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...