Hi, im looking for help on how to add a text fader to my website,
usually i'm working with css but in this case i need to add java script
to make it work, that wasn't the problem but somehow it seems like they
are not compatible with each other so when i add the text fader code in
the <body> tag,the rest of my site is gone :S if someone please can
have a look at my code and tell what am i doing wrong.
thx allot for whom of you who can =)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<SCRIPT LANGUAGE="javascript" TYPE="text/javascript">
var loop = true; // toggle on/off
var xpos = "120"; // left distance
var ypos = "30"; // top distance
var wide = "565"; // layer width
var rate = "250"; // change speed
var tnum = "1";
var t = new Array();
t[1] = ".....100% Natural 100% Natural 100% Natural 100% Natural 100%
Natural.....";
t[2] = "...Shop Online...";
t[3] = ".... Grow Your Own !";
var cnum = "1";
var c = new Array();
c[1] = "lightgreen";
c[2] = "gray";
c[3] = "silver";
c[4] = "whitesmoke";
c[5] = "white";
c[6] = "white";
c[7] = "white";
c[8] = "whitesmoke";
c[9] = "silver";
c[10] = "gray";
c[11] = "green";
c[12] = "lightgreen";
if(document.layers)document.write("<layer name='hi' left='"+xpos+"'
top='"+ypos+"' width='"+wide+"'></layer>");
if(document.all)document.write("<div id='hi'
style='position:absolute;left:"+xpos+";top:"+ypos+ ";width:"+wide+"'>");
function glow()
{
if(document.layers)
{
if(tnum < t.length)
{
if(cnum < c.length-1)
{
document.layers["hi"].document.write("<font size=5
color='"+c[cnum]+"'>"+t[tnum]+"</font>");
document.layers["hi"].document.close();
cnum++;
}
else
{
cnum = 1;
tnum++;
if(loop)
{
if(tnum == t.length) tnum = 1;
}
}
setTimeout("glow()",rate);
}
else
{
document.layers["hi"].document.write("");
document.layers["hi"].document.close();
}
}
if(document.all)
{
if(tnum < t.length)
{
if(cnum < c.length-1)
{
document.all("hi").innerHTML = "<font size=3 font face=Arial,
Helvetica, sans-serif color='"+c[cnum]+"'>"+t[tnum]+" </font>";
cnum ++;
}
else
{
cnum = 1;
tnum ++;
if(loop)
{
if(tnum == t.length) tnum = 1;
}
}
setTimeout("glow()",rate);
}
else document.all("hi").innerHTML = "";
}
}
</SCRIPT>
<style type="text/css">
body{background-color:#000000}
#headline{position:absolute; left:-2px; top: 13px; margin: 10px 200px
500px 10px}
#navbar
{
position:absolute;
left:76px;
top: 112px;
list-style: none;
padding: 2px;
padding-left : 1.5em;
padding-right : 1.5em;
margin: 1px 1px 1px 1px;
white-space: nowrap;
background: #000;
text-align: right;
line-height: 1.2em;
}
#navbar a.xxx {
padding-left : 1em;
padding-right : 1em;
color: #25BC5F;
background-color: #000;
border-top: 1px solid #333333;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
border-left: 1px solid #333333;
text-decoration: none;}
#navbar a:hover.xxx {
color: #25BC5F;
background-color: #333;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;}
p{font-color:#F0F0F0;
font-size:10px;
font-face:Arial, Helvetica, sans-serif;}
#intro{position:absolute;
left:911px;
top:119px;
width:8%;
letter-spacing:0.03cm;}
#natural{position:absolute;left:444px;top:707px}
..container{
position:absolute;
margin: auto;
width: 600px;
height:600px;
padding-left:20px;
padding-right:20px;
border-left:1px solid #333;
border-right:1px solid #333;
left: 284px;
top: 114px;
}
#content{position:absolute;
left:168px;
top:34px;
width:53%;
letter-spacing:0.03cm;
border-style:solid;
border-color:#333333;
border-width:1px;
padding:3%;}
#content img
{
float:left;
margin:6px 10px 90px 10px;
left:200px;
top:270px;}
#content1{position:absolute;
left:168px;
top:194px;
width:53%;
letter-spacing:0.03cm;
border-style:solid;
border-color:#333333;
border-width:1px;
padding:3%;}
#content1 img
{
float:left;
margin:6px 10px 90px 10px;
left:200px;
top:350px;}
</style>
</head>
<BODY onLoad='glow()'>
<div id="headline">
<img src="images/mnbanner1.jpg"/></div>
<div id="navbar"><font face="Terminator Two" size="2">
<a href="index1.htm" class="xxx">Home</a><br><br>
<a href="index2.htm" class="xxx">Flowers</a><br><br>
<a href="index3.htm" class="xxx">Herbs</a><br><br>
<a href="index4.htm" class="xxx">Order Info</a><br><br>
<a href="index5.htm" class="xxx">Order Form</a><br><br>
<a href="index6.htm" class="xxx">Contact</a><br><br>
</font></div>
<div id="intro">
<p><font color="F0F0F0" size="2" face="Terminator Two">Mushrooms</font>
<font color="#F0F0F0" size="1" face="Arial, Helvetica, sans-serif"><br>
Grow your own , it's fast and easy, you'll be surprised to have results
with no time.</font>
</p></div>
<div class="container">
<div id="content">
<img src="images/waterlily.jpg" width="80" height="100" />
<p><font color="#F0F0F0" size="1" face="Arial, Helvetica,
sans-serif">This strain is known as the most predominant, it produces
small fruits but considered
one of the strongest producers.
This species grows very fast, translucent when young, then turning
gray to white.
Growing instructions included.<br>
Please add it to my <a href="ordertest2.php"
target="_blank">order</a></font>
</p></div>
<div id="content1">
<p>
<img src="images/tulip.jpg"
width="80" height="100" />
<font color="#F0F0F0" size="1" face="Arial, Helvetica, sans-serif">The
This strain is the most famous in the world from primitive ages till
today.
Strong thin and tall potent producer.
Growing instructions included.<br>
Please add it to my <a href="ordertest2.php"
target="_blank">order</a></font>
</p>
</div>
</div>
<div id="natural">
<img src="images/100natural.jpg"/></div>
</body>
</html>
