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.
Any suggestions?
Thanks,
Brett
<!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> 11  18868 
brett wrote: 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.
Any suggestions?
Thanks,
Brett
you can use any ID tag as many times as you want. however, it wont work
until you get your javascript to iterate over all elements with the
specified ID. not a css problem !
<!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>
"brett" <ac*****@cygen.com> wrote:
What's your stylesheet question? The following answers relate to the
HTML and JavaScript issues that your post raises. 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.
Well they can't.
IDs must be unique and NAME is not a valid attribute for DIVs.
<script type="text/javascript">
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>
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
Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor
Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
brett wrote: 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.
Any suggestions?
Thanks,
Brett
<!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>
You cannot have elements with duplicate IDs but you can have duplicate
NAMEs more common with form fields... Use getElementsByName...
#### demo code:
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--
function changeMe( n, i ){
var ones=document.getElementsByName(n);
ones[i].style.backgroundColor="red";
}
//-->
</script>
</head>
<body>
<div name="one">This is 0</div>
<div name="one">This is 1</div>
<div name="one">This is 2</div>
<div name="one">This is 3</div>
<a href="#" onclick="changeMe('one',0)">Change 0</a><br>
<a href="#" onclick="changeMe('one',1)">Change 1</a><br>
<a href="#" onclick="changeMe('one',2)">Change 2</a><br>
<a href="#" onclick="changeMe('one',3)">Change 3</a><br>
</body>
</html>
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO http://www.LittleWorksStudio.com
This code gives the error
style is null or not an object
I'm using IE6.
Brett
Ok, I think this is back to a CSS issue. I almost have this working
now but need two things to happen.
- I'd like the image to gray out with the text.
- I'd like the "This area will not fade out." to not fade.
Also, if it could work in Firefox, Netscape 7 and IE6 that would be
great. How can I accomplish the above?
<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(){
var divs;
if (document.getElementsByTagName &&
(divs = document.getElementsByTagName('em'))) {
for (var i = 0; i < divs.length; i++) {
divs = divs.item(i);
//document.getElementById('sample')
divs.style.color="rgb("+hex+","+hex+","+hex+")";
// access divs[i] here
}
}
}
/*
function fadetext(){
if(hex>0) { //If color is not black yet
hex-=11; // increase color darkness
document.getElementsByName("sample").style.color=" rgb("+hex+","+hex+","+hex+")";
//setTimeout("fadetext()",20);
}
}
*/
</script>
<em id="sample" style="width:100%"><h3>John slowly faded into view</h3>
<div style="color: none;">This area will not fade out.</div><br>
<div style="filter: mask(color=BDBDBD);>
<img src="http://www.google.com/images/logo.gif" alt="" border="0">
</div>
<br>
<h3>Another fade occurs here.</h3></em>
<button onClick="fadetext()">Fade Text</button>
Thanks,
Brett
"brett" <ac*****@cygen.com> wrote:
Please don't top post. Ok, I think this is back to a CSS issue. I almost have this working
now but need two things to happen.
- I'd like the image to gray out with the text.
There's an opacity property in CSS3 that, IIRC, is supported as
-moz-opacity in Mozilla. Might be supported by some other browsers as
well.
Oh, there are the non-standard MSIE filters as well, but it looks like
you've already discovered them.
- I'd like the "This area will not fade out." to not fade.
Then don't put it inside an element that's affected by your script.
Also, if it could work in Firefox, Netscape 7 and IE6 that would be
great. How can I accomplish the above?
<script type="text/javascript">
hex=224 // Initial color value.
function fadetext(){
var divs;
if (document.getElementsByTagName &&
(divs = document.getElementsByTagName('em'))) {
The TagName in getElementsByTagName() should always be uppercase, so
EM in this case. Even when your using XHTML where the actual tags must
be lowercase.
for (var i = 0; i < divs.length; i++) {
divs = divs.item(i);
Redefining the variable 'divs' inside a loop that's being iterated
over the array 'divs' could cause problems but I'm not sure. Anyway,
as I said before ask JS questions in comp.lang.javascript.
//document.getElementById('sample')
divs.style.color="rgb("+hex+","+hex+","+hex+")";
// access divs[i] here
}
}
}
</script>
<em id="sample" style="width:100%"><h3>John slowly faded into view</h3>
<div style="color: none;">This area will not fade out.</div><br>
CSS issue: 'none' is not an accepted value for color in CSS.
<div style="filter: mask(color=BDBDBD);>
<img src="http://www.google.com/images/logo.gif" alt="" border="0">
</div>
<br>
<h3>Another fade occurs here.</h3></em>
<button onClick="fadetext()">Fade Text</button>
HTML issue: you can not nest block level elements like <h3> and <div>
inside inline elements like <em>.
Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor
Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
brett wrote: This code gives the error
style is null or not an object
I'm using IE6.
Brett
Damn! seems MSIE cannot grab a the collection if they all have the same
name...if your check ones.length in Gecko your get 4 for MSIE 0.
If I get a moment I'll check this out...I know you can grab a collection
of form fields, I do it on my order forms...
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO http://www.LittleWorksStudio.com
I've got it working but have another issue related to formatting, which
is a different post in this group. Here's the working code:
<script type="text/javascript">
hex=224 // Initial color value.
function fadetext(){
var nodeObjectTag
var nodeObjectImg
for (var i = 1; i < 3; i++)
{
nodeObjectTag = "sample"+i;
document.getElementById(nodeObjectTag).style.color =
"rgb("+hex+","+hex+","+hex+")";
}
i=1
for (var i = 1; i < 2; i++)
{
nodeObjectImg = "imgsample"+i;
document.getElementById(nodeObjectImg).style.MozOp acity=.20;
document.getElementById(nodeObjectImg).filters.alp ha.opacity=15;
}
}
</script>
<div id="sample1" style="width:100%"><h3>John slowly faded into
view---</h3>
</div>
<a href="x">Here is a problem link</a><br>
<!--style="filter:alpha(opacity=100)"
crossobj.style.MozOpacity-->
<img src="http://www.google.com/images/logo.gif" alt=""
name="imgsample1" id="imgsample1" border="0"
style="filter:alpha(opacity=100); -moz-opacity:1"><br>
<div id="sample2" style="width:100%"><h3>Another fade occurs
here.</h3></div>
<br>
<a href="x">Here is another problem link</a>
<br><br>
<button onClick="fadetext()">Fade Text</button>
Brett
*Jonathan N. Little* <lw*****@centralva.net>:
<div name="one">This is 0</div>
<div name="one">This is 1</div>
Like Steve already said, there is no 'name' attribute for the 'div'
element type in HTML. This thread is off topic in ciwah.
--
"Right way turning, Listen we are learning.
Head's full of noise, Chicken's got no choice.
Heads are rollin', Chicken blood is stolen.
The rest of the chicken wants a picke-nicken" Guano Apes - We use the Pain
Christoph Paeper <ch**************@nurfuerspam.de> wrote: This thread is off topic in ciwah.
Pssst, this is ciwas...
It's okay, I won't tell anyone, oh...
Steve
--
"Reality must take precedence over public relations.
Nature cannot be fooled." - Richard Feynman
Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Christoph Paeper wrote: *Jonathan N. Little* <lw*****@centralva.net>:
<div name="one">This is 0</div>
<div name="one">This is 1</div>
Like Steve already said, there is no 'name' attribute for the 'div'
element type in HTML. This thread is off topic in ciwah.
DOH! Right, thinking too fast on the problem and forgetting the syntax! ;-)
He could make a container DIV for all the child DIVs, and grab
collection of DIVs from the parent's ID and index through it....
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO http://www.LittleWorksStudio.com This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Rolf Wester |
last post by:
Hi,
I have a form with a select element with multiple="true". When using the
GET method (I suppose the same happens with the POST method) I can seen
that the form sends channels=CH1&channels=CH2...
|
by: Darren Dale |
last post by:
Hello,
def test(data):
i = ? This is the line I have trouble with
if i==1: return data
else: return data
a,b,c,d = test()
|
by: Ohaya |
last post by:
Hi,
I'm trying to understand a situation where ASP seems to be "blocking" of
"queuing" requests. This is on a Win2K Advanced Server, with IIS5.
I've seen some posts (e.g.,...
|
by: Ben Hallert |
last post by:
Hi guys,
I'm trying to figure out what bone headed mistake I made on something I
put together. I've got a form (named 'context') that has a variable
number of select-multiple inputs on it. ...
|
by: Matthew Louden |
last post by:
I want to know why C# doesnt support multiple inheritance? But why we can
inherit multiple interfaces instead? I know this is the rule, but I dont
understand why. Can anyone give me some concrete...
|
by: Abhishek Srivastava |
last post by:
Hello All,
In IIS 6.0 We have a concept of worker processes and application pools.
As I understand it, we can have multiple worker process per appliction
pool. Each worker process is dedicated...
|
by: Graham |
last post by:
I have been having some fun learning and using the new Controls and methods in .Net 2.0 which will make my life in the future easier and faster. Specifically the new databinding practises and...
|
by: Matt Kruse |
last post by:
While developing an internal IE6-only webapp, a discussion started about the
'best' way to apply classes to data tables across multiple pages. The two
arguments were:
1. Apply a single class to...
|
by: keerthyragavendran |
last post by:
hi
i'm downloading a single file using multiple threads...
how can i specify a particular range of bytes alone from a single
large file... for example say if i need only bytes ranging from...
|
by: bonneylake |
last post by:
Hey Everyone,
Well recently i been inserting multiple fields for a section in my form called "serial". Well now i am trying to insert multiple fields for the not only the serial section but also...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |
