Only the first <div> executes in the following code. I'd like the
second to execute as well. This code is dynamically generated so I
won't know exactly how many <div> tags will be needed. If they can all
use the same ID/Name that shouldn't be a problem. Also, instead of
using a button, I'll execute fadetext() on page load.
I've posted a suggestion below the code from the sytelsheets group,
which involves arrays and looping that I'd like help with.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script type="text/javascript">
/* grays
RGB(184,184,184) #B8B8B8
RGB(192,192,192) #C0C0C0
RGB(200,200,200) #C8C8C8
RGB(208,208,208) #D0D0D0
RGB(216,216,216) #D8D8D8
RGB(224,224,224) #E0E0E0
RGB(232,232,232) #E8E8E8
RGB(240,240,240) #F0F0F0
RGB(248,248,248) #F8F8F8
RGB(255,255,255) #FFFFFF
*/
hex=224 // Initial color value.
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementById("sample").style.color=
"rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
</script>
<div id="sample" style="width:100%"><h3>John slowly faded into
view</h3></div>
This area will not fade out.<br>
<div id="sample" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<button onClick="fadetext()">Fade Text</button>
</body>
</html>
This suggestion came from the sytelsheets group. This is what I'm
wondering how to do - the array and looping part. Any suggestions?
Thanks,
Brett
---------------
Well they can't.
IDs must be unique and NAME is not a valid attribute for DIVs.
Give them all the same CLASS. You can then use
getElementsByTagName('DIV') to create an array of all the DIVs in the
page and then go through that array checking that the .className
property matches the class you want to apply the fade to. Further
questions on the DOM/JavaScript aspects would be better asked in
comp.lang.javascript
