Flexi slide show help

**islandgirl** · 11-02-2005, 03:28 PM

OK- I am VERY new to this and really don't have a clue what I am doing. I would like to add slide shows to our website some with pics from games etc. and one with the graphics from our sponsors (on dif pgs). I chose this script because it said it didn't matter if my pics were the same size. I thought that I followed the directions but apparently not. If you anyone can help - and I am sure it is an easy fix - please help. I know that it is a variables problem but being so clueless I don't know how to fix it.

Thanks in Advance

<body>

<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]=href="http://eteamz.active.com/fbhssoccer/images/Ameliaislandintmed.jpg"
variableslide[1]=href="http://eteamz.active.com/fbhssoccer/images/boa.gif
variableslide[2]=href="http://eteamz.active.com/fbhssoccer/images/coastal_logo.gif"

//configure the below 3 variables to set the dimension/background color of the slideshow

var slidewidth='120px' //set to width of LARGEST image in your slideshow
var slideheight='77px' //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_slider(){
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_slider()
else if (document.layers)
window.onload=start_slider

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

**jscheuer1** · 11-02-2005, 03:55 PM

This:

Code:

variableslide[0]=href="http://eteamz.active.com/fbhssoccer/images/Ameliaislandintmed.jpg"
variableslide[1]=href="http://eteamz.active.com/fbhssoccer/images/boa.gif
variableslide[2]=href="http://eteamz.active.com/fbhssoccer/images/coastal_logo.gif"

should be:

Code:

variableslide[0]=["http://eteamz.active.com/fbhssoccer/images/Ameliaislandintmed.jpg", "", ""]
variableslide[1]=["http://eteamz.active.com/fbhssoccer/images/boa.gif", "", ""]
variableslide[2]=["http://eteamz.active.com/fbhssoccer/images/coastal_logo.gif", "", ""]

**islandgirl** · 11-02-2005, 03:56 PM

OK- I viewed someone's source code and got most of my problems fixed. The only problem now is that my text takes up two lines. How do I get it to center itself under the graphic? It is smaller than the graphics.

Once again, thanks in advance

<center>
<body>

<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]= ["http://eteamz.active.com/fbhssoccer/images/Ameliaislandintmed.jpg",'',"Support Our

Sponsors!"]
variableslide[1]=["http://eteamz.active.com/fbhssoccer/images/boa.gif",'',"Support Our Sponsors!"]
variableslide[2]=["http://eteamz.active.com/fbhssoccer/images/coastal_logo.gif",'',"Support Our Sponsors!"]

//configure the below 3 variables to set the dimension/background color of the slideshow

var slidewidth='120px' //set to width of LARGEST image in your slideshow
var slideheight='77px' //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_slider(){
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_slider()
else if (document.layers)
window.onload=start_slider

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

</center>

**jscheuer1** · 11-02-2005, 05:04 PM

Set these variables as per instructions:

Code:

var slidewidth='120px' //set to width of LARGEST image in your slideshow
var slideheight='77px' //set to height of LARGEST iamge in your slideshow, plus any text description

With your current images, that would be about:

Code:

var slidewidth='492px' //set to width of LARGEST image in your slideshow
var slideheight='328px' //set to height of LARGEST iamge in your slideshow, plus any text description

Add align="center" here:

Code:

if (ie||dom)
document.write('<div align="center" id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')

Thread: Flexi slide show help

Thread Tools

Search Thread

Flexi slide show help

flexi slide show help update

Bookmarks

Bookmarks

Posting Permissions