Slide show

[paul in london]

Hi all

Im trying to add a javascript fade in / out slideshow to my home page fragment. It all works fine in Dreamweaver, but as soon as I put it into Actinic I get nothing?

Has anyone had similar problems?

Paul

[neilspinney]

have you tried publishing the site and included any additional script files that are needed?

Neil

[NormanRouxel]

You've provided so little info there's nothing anyone can do but offer general suggestions.

Why not publish the site and let us know the URL of a failing page?

[paul in london]

Hi

Thanks for your replys. The code is in the home page fragment. On the home page it should appear where Ive placed an "H" on the screen.

Unfortunately the code can only be seen in the Page Source Code.

Thanks

Paul

[paul in london]

It seems that actinic has added "acatalog/" to the image path?

[Duncan Rounding]

The address of your first slide is invalid and in any case they are not uploaded.

dropimages<Actinic:Variable Name = '0'/>="acatalog/_Website-Images\_HomePage-images\HP Slide Show\Previews\slide_1.jpg"
dropimages<Actinic:Variable Name = '1'/>="acatalog/slide_2.jpg"
dropimages<Actinic:Variable Name = '2'/>="acatalog/logo.gif"

The first thing to do is to correct the image paths in the script and add the files to the additional files list.

[paul in london]

Thanks for your reply

I know the 1st one is invalid, but the 3rd one is on the site, so at least that one should work.

Ill make the corrections and reload

Thanks

[Duncan Rounding]

Also add the others to the Additional Files List.

[Duncan Rounding]

Look in the script and wherever you see something in square brackets then add spaces as per:

dropimages[0]="image1.gif"
will become
dropimages[ 0 ]="image1.gif"

You should also leave the credits in the top of the script to comply with legal use.

Try this:

<script language="JavaScript1.2">

//Presentational Slideshow Script- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for legal use

var slideshow_width='100px' //SET SLIDESHOW WIDTH (set to largest image's width if multiple dimensions exist)
var slideshow_height='100px' //SET SLIDESHOW HEIGHT (set to largest image's height if multiple dimensions exist)
var pause=3000 //SET PAUSE BETWEEN SLIDE (2000=2 seconds)
var slidebgcolor="white"

var dropimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
dropimages[ 0 ]="image1.gif"
dropimages[ 1 ]="image2.gif"
dropimages[ 2 ]="image3.gif"

var droplinks=new Array()
//SET IMAGE URLs. Use "" if you wish particular image to NOT be linked:
droplinks[ 0 ]="http://www.yahoo.com"
droplinks[ 1 ]=""
droplinks[ 2 ]="http://www.google.com"


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

</script>

[NormanRouxel]

Or, instead of embedding the JavaScript into you page (where Actinic is inadvertently munging some of the code), why not save it as a file and include it via:

<script type="text/javascript" src="myslideshow.js"></script>

Because Actinic leaves external JavaScript files alone.