Flexi-slideshow question
I need help with something, i'm trying to put 2 flexi-slideshows on the same page ,ive done everything, every tutorial, has said to do such as putting the onload in the body tag...changing the variable and function names.. maybe im doing something wrong,, perhaps one of you can let me know, this problem has been very humbling...the first pic shows up but not the 2nd here's the code, the 1st flexi script has been changed.... from the vars to the function names...the 2nd is straight from http://www.dynamicdrive.com/dynamici...flexislide.htm
to make it easy on you, i changed names by adding an 01 after the function names and variables, instead of completly renaming them...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<body onload="start_slider1();start_slider2()">
<script language="JavaScript1.2">
/***********************************************
* Flexi Slideshow- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
var variableslide01=new Array()
//variableslide01[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"]
variableslide01[0]=['ball.gif', '', '']
variableslide01[1]=['spaceship.gif', 'http://www.space.com', 'Has aliens landed on earth? You decide.']
variableslide01[2]=['cake.gif', '', '']
//configure the below 3 variables to set the dimension/background color of the slideshow
var slidewidth01='130px' //set to width of LARGEST image in your slideshow
var slideheight01='120px' //set to height of LARGEST iamge in your slideshow, plus any text description
var slidebgcolor01='#F3F3F3'
//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay01=3000
////Do not edit pass this line////////////////
var eio=document.all
var doom=document.getElementById
for (i=0;i<variableslide01.length;i++){
var cacheimage01=new Image()
cacheimage01.src=variableslide01[i][0]
}
var currentslide01=0
function rotateimages01(){
contentcontainer='<center>'
if (variableslide01[currentslide01][1]!="")
contentcontainer+='<a href="'+variableslide01[currentslide01][1]+'">'
contentcontainer+='<img src="'+variableslide01[currentslide01][0]+'" border="0" vspace="3">'
if (variableslide01[currentslide01][1]!="")
contentcontainer+='</a>'
contentcontainer+='</center>'
if (variableslide01[currentslide01][2]!="")
contentcontainer+=variableslide01[currentslide01][2]
if (document.layers){
crossrotateobj.document.write(contentcontainer)
crossrotateobj.document.close()
}
else if (eio||doom)
crossrotateobj.innerHTML=contentcontainer
if (currentslide01==variableslide01.length-1) currentslide01=0
else currentslide01++
setTimeout("rotateimages01()",slidedelay01)
}
if (eio||doom)
document.write('<div id="slidedom" style="width:'+slidewidth01+';height:'+slideheight01+'; background-color:'+slidebgcolor01+'"></div>')
function start_slider1(){
crossrotateobj=doom? document.getElementById("slidedom") : eio? document.all.slidedom : document.slidensmain.document.slidenssub
if (document.layers)
document.slidensmain.visibility="show"
rotateimages01()
}
if (eio||doom) start_slider1()
else if (document.layers)
</script>
<ilayer id="slidensmain" width=&{slidewidth01}; height=&{slideheight01}; bgColor=&{slidebgcolor01}; visibility=hide><layer id="slidenssub" width=&{slidewidth01}; left=0 top=0></layer></ilayer>
<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
<script language="JavaScript1.2">
/***********************************************
* Flexi Slideshow- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
var variableslide=new Array()
//variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"]
variableslide[0]=['ball.gif', '', '']
variableslide[1]=['spaceship.gif', 'http://www.space.com', 'Has aliens landed on earth? You decide.']
variableslide[2]=['cake.gif', '', '']
//configure the below 3 variables to set the dimension/background color of the slideshow
var slidewidth='130px' //set to width of LARGEST image in your slideshow
var slideheight='120px' //set to height of LARGEST iamge in your slideshow, plus any text description
var slidebgcolor='#F3F3F3'
//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay=3000
////Do not edit pass this line////////////////
var ie=document.all
var dom=document.getElementById
for (i=0;i<variableslide.length;i++){
var cacheimage=new Image()
cacheimage.src=variableslide[i][0]
}
var currentslide=0
function rotateimages(){
contentcontainer='<center>'
if (variableslide[currentslide][1]!="")
contentcontainer+='<a href="'+variableslide[currentslide][1]+'">'
contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">'
if (variableslide[currentslide][1]!="")
contentcontainer+='</a>'
contentcontainer+='</center>'
if (variableslide[currentslide][2]!="")
contentcontainer+=variableslide[currentslide][2]
if (document.layers){
crossrotateobj.document.write(contentcontainer)
crossrotateobj.document.close()
}
else if (ie||dom)
crossrotateobj.innerHTML=contentcontainer
if (currentslide==variableslide.length-1) currentslide=0
else currentslide++
setTimeout("rotateimages()",slidedelay)
}
if (ie||dom)
document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')
function start_slider2(){
crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub
if (document.layers)
document.slidensmain.visibility="show"
rotateimages()
}
if (ie||dom)
start_slider2()
else if (document.layers)
</script>
<ilayer id="slidensmain" width=&{slidewidth}; height=&{slideheight}; bgColor=&{slidebgcolor}; visibility=hide><layer id="slidenssub" width=&{slidewidth}; left=0 top=0></layer></ilayer>
<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
</body>
</html>
CSS Codes
Reply With Quote
Bookmarks