How can I fade multiple divs?

@yamaharussJan 15.2008

I have the fade function down but I am dynamically creating a table with multiple rows. One cell in each table with have a unique div created..

<tr><td><div id=fade_99654>stuff</div></td><td>stuff</td></tr>
<tr><td><div id=fade_45215>stuff</div></td><td>stuff</td></tr>
<tr><td><div id=fade_78155>stuff</div></td><td>stuff</td></tr>
<tr><td><div id=fade_65324>stuff</div></td><td>stuff</td></tr>
<tr><td><div id=fade_81354>stuff</div></td><td>stuff</td></tr>
ect…

How can I run FadeThem() on all divs with a prefix of “fade_”?

to post a comment

JavaScript

@cgishackJan 15.2008 — #do you want to fade the all at the same time, or randomly?

If you want to fade them all at the same time you can give them all the same "name" then [B]getElementsByName[/B]("[COLOR="Red"]someName[/COLOR]")

you then have an array and can simply modify your function to loop through the array.

Drew

@yamaharussauthorJan 15.2008 — #I tried getElementsByName("someName") but it only affected the first div in the table and ignored the rest.

<tr><td><div id=fade>stuff</div></td><td>stuff</td></tr> //This one Faded

<tr><td><div id=fade>stuff</div></td><td>stuff</td></tr>

<tr><td><div id=fade>stuff</div></td><td>stuff</td></tr>

<tr><td><div id=fade>stuff</div></td><td>stuff</td></tr>

<tr><td><div id=fade>stuff</div></td><td>stuff</td></tr>

@cgishackJan 15.2008 — #Here is some code you can use to help getElementsByName and loop/

<i>
 </i>&lt;script&gt;
 
 function fade()
 {
 var fades= document.getElementsByName("fadeDiv");
 
 <i>	</i>for (var i=0; i&lt;=fades.length-1; i++)
 <i>	</i>{
 <i>	</i>	alert(fades[i].id + " can be faded")
 <i>	</i>}
 
 
 }
 
 
 &lt;/script&gt;
 
 
 &lt;table&gt;
 &lt;tr&gt;&lt;td&gt;&lt;div name="fadeDiv" id=fade_99654&gt;stuff&lt;/div&gt;&lt;/td&gt;&lt;td&gt;stuff&lt;/td&gt;&lt;/tr&gt;
 &lt;tr&gt;&lt;td&gt;&lt;div name="fadeDiv" id=fade_33442&gt;stuff&lt;/div&gt;&lt;/td&gt;&lt;td&gt;stuff&lt;/td&gt;&lt;/tr&gt;
 &lt;tr&gt;&lt;td&gt;&lt;div name="fadeDiv" id=fade_85434&gt;stuff&lt;/div&gt;&lt;/td&gt;&lt;td&gt;stuff&lt;/td&gt;&lt;/tr&gt;
 &lt;tr&gt;&lt;td&gt;&lt;div name="fadeDiv" id=fade_45667&gt;stuff&lt;/div&gt;&lt;/td&gt;&lt;td&gt;stuff&lt;/td&gt;&lt;/tr&gt;
 &lt;tr&gt;&lt;td&gt;&lt;div name="fadeDiv" id=fade_24567&gt;stuff&lt;/div&gt;&lt;/td&gt;&lt;td&gt;stuff&lt;/td&gt;&lt;/tr&gt;
 &lt;/table&gt;
 
 
 &lt;input type="button" value="Click Me" onclick="fade();" /&gt;

Drew

@cgishackJan 15.2008 — #Maybe post your fade code to help us go further.

Drew

How can I fade multiple divs?

4 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

How can I fade multiple divs?

4 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #JavaScript _↴