PDA

View Full Version : Please Help with Centered Text Added to the javascript I am using.


Micario
08-15-2004, 07:44 PM
Hi my name is Mac.

I have found a really good script for slideshows, here and would like to add Text to the slides. I use both IE6 and NS7.1, and have XP Pro as Win Version. I especially like it because it supports varied image sizes and centers everything.

I am a novice when it comes to javascripts.

I will post the Script here and perhaps someone can help me! This is basically a dummy script as I will fill in the slideshows when it's working.

<html>
<body>


<center>

<table border="6" cellpadding="0" width="982" height="800" align="center"bgcolor="#F89900" cellspacing="0">
<p>

<a href="javascript:setslide(0)"<b>Start - Stop</b></a><br>
<a href="javascript:setslide(1)"<b>Acadia</b></a><br>
<a href="javascript:setslide(2)"<b>Oregon</b></a><br>
<a href="javascript:setslide(3)"<b>California</b></a></p><br>

<tr>
<td valign="center" align="center">




<script language="JavaScript1.2">


/*Multi image slideshow script- by javascriptkit.com
Visit JavaScript Kit (http://javascriptkit.com) for script
Credit must stay intact for use*/

//#1 SPECIFY number of slideshows
var number_of_slideshows=4

//#2 SPECIFY interval between slide (2000=2 seconds)
var interval=5000

//#3 SHOULD each slide be linked to a unique URL?
var linked=1

var slidewidth='768px'
var slideheight='512px'

var slideshows=new Array(number_of_slideshows)
for (i=0; i <number_of_slideshows; i++)
slideshows[i]=new Array()

//#4 SPECIFY image paths of 1st slideshow
slideshows[0][0]='http://www.geocities.com/barriewadman@sbcglobal.net/centview.gif'


//SPECIFY image paths of 2nd slideshow (remove if number_of_slides less than 2)
slideshows[1][0]='http://www.arcatapet.net/image/dyh01.jpg'
slideshows[1][1]='http://www.serve.com/wizjd/pics/yosm01_m.jpg'
slideshows[1][2]='http://www.serve.com/wizjd/parks/photo/mediumSize/Arches01.jpg'


//SPECIFY image paths of 3rd slideshow (remove if number_of_slides less than 3)
slideshows[2][0]='http://www.serve.com/wizjd/pics/gbas01_m.jpg'
slideshows[2][1]='http://www.serve.com/wizjd/pics/gtet01_m.jpg'
slideshows[2][2]='http://www.serve.com/wizjd/pics/gtet04_m.jpg'

slideshows[3][0]='http://www.jdonohue.com/parks/photo/mediumSize/Acadia01.jpg'
slideshows[3][1]='http://www.serve.com/wizjd/pics/yosm02_m.jpg'
slideshows[3][2]='http://www.serve.com/wizjd/parks/photo/mediumSize/Arches01.jpg'

//EXTEND THIS ARRAY if more than 3 slide shows

<!--Remove the below portion if "var linked" above is set to 0-->

var slidelinks=new Array(number_of_slideshows)
for (i=0; i <number_of_slideshows; i++)
slidelinks[i]=new Array()

//#5 SPECIFY urls of 1st slideshow
slidelinks[0][0]='http://mysite.com/car1.htm'
slidelinks[0][1]='http://mysite.com/car2.htm'
slidelinks[0][2]='http://mysite.com/car3.htm'


//SPECIFY urls of 2nd slideshow (remove if number_of_slides=1)
slidelinks[1][0]='http://mysite.com/house1.htm'
slidelinks[1][1]='http://mysite.com/house2.htm'
slidelinks[1][2]='http://mysite.com/house3.htm'


//SPECIFY urls of 3rd slideshow (remove if number_of_slides less than 3)
slidelinks[2][0]='http://mysite.com/boat1.htm'
slidelinks[2][1]='http://mysite.com/boat2.htm'
slidelinks[2][2]='http://mysite.com/boat3.htm'

function clickredir(){
window.location=slidelinks[maininc][subinc]
}

<!-- END removal ---------------------------------->

var maininc=0
var subinc=0

if (linked)
document.write('<a href="javascript:clickredir()"><img src="'+slideshows[0][0]+'" name="multislide" border=4></a>')
else
document.write('<img src="'+slideshows[0][0]+'" name="multislide">')

function slideit(){
subinc= (subinc<slideshows[maininc].length-1)? subinc+1: 0
document.images.multislide.src=slideshows[maininc][subinc]
}

function setslide(which){
clearInterval(runit)
maininc=which
subinc=0
runit=setInterval("slideit()",interval)
}

runit=setInterval("slideit()",interval)

</script>

</td><//tr></table>
</center>
</body>
</html>

Hope Someone Can help
Micario - Mac

ucm
08-16-2004, 06:30 PM
try changing:

<table border="6" cellpadding="0" width="982" height="800" align="center"bgcolor="#F89900" cellspacing="0">
<p>

<a href="java script:setslide(0)"<b>Start - Stop</b></a><br>
<a href="java script:setslide(1)"<b>Acadia</b></a><br>
<a href="java script:setslide(2)"<b>Oregon</b></a><br>
<a href="java script:setslide(3)"<b>California</b></a></p><br>

<tr>
<td valign="center" align="center">



to


<table border="6" cellpadding="0" width="982" height="800" align="center"bgcolor="#F89900" cellspacing="0">
<tr>
<td valign="center" align="center"><a href="java script:setslide(0)"<b>Start - Stop</b></a><br>
<a href="java script:setslide(1)"<b>Acadia</b></a><br>
<a href="java script:setslide(2)"<b>Oregon</b></a><br>
<a href="java script:setslide(3)"<b>California</b></a><br></td></tr>
<tr>
<td valign="center" align="center">

Micario
08-16-2004, 07:30 PM
You are right the code is cleaner for centering and the table setup itself.

Maybe i wasn't clear enough. I am trying to add text to each image and don't know how. When I play the page, all the slides come up fine and are centered in both IE and Netscape.

I don't know anything about javascript, except what I've learned by finding scripts and playing with them.

What I need is a script that will allow Multiple Slideshows, Multiple varied-sized images with text and that I can input onto a page within a table and/or frame.

As you can see I am grabbing the images off of web sites so that I don't have to store them.

It would also be nice if I could specify a max height and width so that I could set the table heigth smaller so as to allow slide viewing without scrolling down the page.

Thanks again, appreciate the help. To show you what I'm trying to do I am using another slideshow script on the page I'm writing, but it only allows one size of image.

http://www.geocities.com/barriewadman@sbcglobal.net/index.html

Have a good day