Script: Presentational slideshow not working after inserting new image

[dianept23]

http://www.dynamicdrive.com/dynamici...ationslide.htm

Using presentation slideshow in website; just replaced an image in the dropimages array listing and now my slideshow is no longer cycling. No images are showing.
I've previously been successful when replacing an existing image with a new one, so not sure why it is not operating properly now. No other change was made, just a new image name inserted between quote marks in the list. ??

[jscheuer1]

Please include a link to the page on your site that contains the problematic code so we can check it out.

[dianept23]

Thanks John -
http://www.ppnq.com/
This is the line in the code that I changed...dropimages[2]="springbouquet.jpg"
I changed out only the image name between the quote marks, then uploaded my image file and my page. The slideshow is now not showing. From your comment before that fixed a previous problem, i made sure file name was correctly entered, as in .jpg, not .JPG.
After that, I'm stumped.

[jscheuer1]

There are 15 images (0 to 14) and only 14 links (0 to 13), make another link. And the rest of the script has been edited and/or has become corrupt replace:

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

var preloadedimages=new Array()
for (p=0;p<dropimages.length ;p++){ preloadedimages[p]="new" Image() preloadedimages[p].src="dropimages[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+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div></div>')
else
document.write('<a href="javascript:rotatelink()"><img name="defaultslide" src="+dropimages%5B0%5D+" border="0"></a>')

var curpos=parseInt(slideshow_width)*(-1)
var degree=10
var curcanvas="canvas0"
var curimageindex=linkindex=0
var nextimageindex=1


function movepic(){
if (curpos<0){
curpos=Math.min(curpos+degree,0)
tempobj.style.left=curpos+"px"
}
else{

clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
var slideimage='<img src="+dropimages%5Bcurimageindex%5D+" border="0">'
tempobj.innerHTML=(droplinks[curimageindex]!="")? '<a href="+droplinks%5Bcurimageindex%5D+">'+slideimage+'</a>' : slideimage
nextimageindex=(nextimageindex<dropimages.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("movepic()",50)" dropslide="eval(temp)" curcanvas="(curcanvas==" canvas0")? canvas1" : canvas0" } else document.images.defaultslide.src="dropimages[curimageindex]" linkindex="curimageindex" curimageindex="(curimageindex<dropimages.length-1)?" curimageindex+1 : 0 } function rotatelink(){ if (droplinks[linkindex]!="" ) window.location="droplinks[linkindex]" } function resetit(what){ curpos="parseInt(slideshow_width)*(-1)" var crossobj="ie4?" eval("document.all."+what) : document.getElementById(what) crossobj.style.left="curpos+" px" } function startit(){ var crossobj="ie4?" eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML="<a href="" +droplinks[curimageindex]+'"><img src="+dropimages%5Bcurimageindex%5D+" border="0"></a>'
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

with:

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

var preloadedimages=new Array()
for (p=0;p<dropimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=dropimages[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+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';background-color:'+slidebgcolor+';left:-'+slideshow_width+'"></div></div>')
else
document.write('<a href="javascript:rotatelink()"><img name="defaultslide" src="'+dropimages[0]+'" border=0></a>')

var curpos=parseInt(slideshow_width)*(-1)
var degree=10
var curcanvas="canvas0"
var curimageindex=linkindex=0
var nextimageindex=1


function movepic(){
if (curpos<0){
curpos=Math.min(curpos+degree,0)
tempobj.style.left=curpos+"px"
}
else{

clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
var slideimage='<img src="'+dropimages[curimageindex]+'" border=0>'
tempobj.innerHTML=(droplinks[curimageindex]!="")? '<a href="'+droplinks[curimageindex]+'">'+slideimage+'</a>' : slideimage
nextimageindex=(nextimageindex<dropimages.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("movepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=dropimages[curimageindex]
linkindex=curimageindex
curimageindex=(curimageindex<dropimages.length-1)? curimageindex+1 : 0
}

function rotatelink(){
if (droplinks[linkindex]!="")
window.location=droplinks[linkindex]
}

function resetit(what){
curpos=parseInt(slideshow_width)*(-1)
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
crossobj.style.left=curpos+"px"
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.innerHTML='<a href="'+droplinks[curimageindex]+'"><img src="'+dropimages[curimageindex]+'" border=0></a>'
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

[dianept23]

John, that did the trick. I'm very "green" on all this stuff; I'm afraid to tinker too much with code so I truly only removed one image name, between quote marks, and replaced with a new image name. I did exact same thing 3 weeks ago and worked beautifully. Any way to explain in simple terms so I can understand what happened?...

[jscheuer1]

It's always possible you did something without realizing it. If you didn't do it. Your editor may have. It's best to use a text only editor like NotePad for these types of edits. It's rare but sometimes the server will do these sorts of things. And there's always the remote possibility that files become corrupt on disk or during transfer.

[dianept23]

Thanks again...I really appreciate your help.