PDA

Click to See Complete Forum and Search --> : Borderless form for slideshow caption

owosso
06-12-2006, 12:02 PM
I used Joe Burn's slideshow with text - worked very well and with great ease. However, I'd like to have the caption text in a borderless box. How can I do that?


<!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>
<style type="text/css">
<!--

body {
margin: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
text-decoration: none;
font-weight: normal;
}
.caption {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
}


#slide1 {
position: absolute;
height: 100%;
width: 400px;
top: 200px;
left: 10px;
}


-->
</style>


</head>

<body>

<div id="bar">&nbsp;</div>




<!--Slideshow 1 Michigan-->

<div id="slide1">
<SCRIPT LANGUAGE="JavaScript">

var num=1
img1 = new Image ()
img1.src = "family_images/Michigan.grandma"
img2 = new Image ()
img2.src = "family_images/Michigan.cindy.maggie"
img3 = new Image ()
img3.src = "family_images/Michigan.maggie.kathy"
img4 = new Image ()
img4.src = "family_images/Michigan.joel.cindy.maggie"
img5 = new Image ()
img5.src = "family_images/Michigan.maggie.amos"
img6 = new Image ()
img6.src = "family_images/Michigan.maggie.byma"
img7 = new Image ()
img7.src = "family_images/Michigan.sara.sam"

text1 = "Grandma Larson's 97th birthday, Sam, Jim and Terri"
text2 = "Cindy and Maggie"
text3 = "Cindy's mom, Kathy, and Maggie. Note Glen's aweing affect on Maggie."
text4 = "Joel, Cindy, Maggie"
text5 = "Maggie, Amos grandparents"
text6 = "Maggie, Byma grandparents"
text7 = "Sara & Sam"

function slideshowUp()
{
num=num+1
if (num==8)
{num=1}
document.mypic.src=eval("img"+num+".src")
document.joe.burns.value=eval("text"+num)
}

function slideshowBack()
{
num=num-1
if (num==0)
{num=7}
document.mypic.src=eval("img"+num+".src")
document.joe.burns.value=eval("text"+num)
}

</SCRIPT>

<!-- The Image and Form Codes are Below -->

<IMG SRC="family_images/Michigan.shower" NAME="mypic" BORDER=0 HEIGHT="400" WIDTH="400">

<FORM NAME="joe">
<textarea name="burns" cols="25" rows="5" class="caption" width="400">March baby shower - Joel's enthusiasm for such events abounds</textarea>
</FORM>

<A HREF="JavaScript:slideshowBack()"> Back</A>

<A HREF="JavaScript:slideshowUp()"> Next</A>





</div>




</body>
</html>
phpnovice
06-12-2006, 12:57 PM
However, I'd like to have the caption text in a borderless box. How can I do that?
That is a CSS question -- not JavaScript. Ask about your TEXTAREA HTML in the CSS forum.
.caption {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
}
<textarea name="burns" cols="25" rows="5" class="caption" width="400"></textarea>
owosso
06-12-2006, 01:23 PM
Is it a css? My caption class, created in css, does not designate a border therefore shouldn't be creating one.

However, the box holding the caption is a form created in the java script coding, thus I'm wondering if it can be edited there?
phpnovice
06-12-2006, 03:35 PM
My caption class, created in css, does not designate a border therefore shouldn't be creating one.
That would be fine for HTML elements that don't have a border by default.
owosso
06-12-2006, 04:17 PM
I guess I'm pretty stupid about this and need simplistic instructions on how to get rid of the border around the text square. To view what I'm talking about check this link:

http://www.adunate.com/familytest.html

Thanks!
phpnovice
06-12-2006, 04:23 PM
I don't need to look at anything. This is still a CSS issue.