Re: Traversing through DOM, identifying td's and manipulating

Nicolas Cohen <[email protected]> Wed, 1 Mar 2006 23:45:45 -0300
Newsgroups gmane.comp.web.dom.wdf
Message-ID <[email protected]>
i know this might be off-topic, but you should try using css :hover  
pseudo-class
theres a fix for explorer so it also takes the hover... http:// 
www.xs4all.nl/~peterned/csshover.html

then you just put you color in the tr.class:hover and no DOM to handle


On 01/03/2006, at 14:21, Ryan Hicks wrote:

> Mandy,
>
>  The most common way I've seen to do what you're trying to do is to:
>
>  1) Set every TD to the unhighlighted state then,
>  2) Set the selected TD to the highlighted state.
>
>  This avoids the problem of having to remember which was previously
> selected.  Just change them all to the default state, then trigger  
> the one
> with the event.
>
>  Something like this:
>
> function mySelect (elm) {
> 	var tds = document.getElementsByTagName("td");
> 	for (var i=0; i < tds.length; i++) {
> 		tds[i].style.bgcolor = '#FFF';
> 		var imgs tds[i].getElementsByTagName("img");
> 		imgs[0].src = imgs[0].src.replace("_active","");
> 	}
> 	elm.style.bgcolor = '#305DAA';
> 	var elmImg elm.getElementsByTagName("img");
> 	elmImg[0].src = elmImg[0].src.replace("","_active");
> }
> ...
> <td style="background-color:#fff" onclick="mySelect(this)">
>
>  Take this pseudo-code with a grain of salt.  It's only meant to  
> explain the
> idea, certainly not work.  Not even close.  ;)
>
> Cheers!
>
> -ryan
>
> -----Original Message-----
> From: [email protected] [mailto:[email protected]] On  
> Behalf Of
> Maninder, Singh
> Sent: Wednesday, March 01, 2006 8:24 AM
> To: [email protected]
> Subject: [wdf-dom] Traversing through DOM, identifying td's and  
> manipulating
>
> Hi Everyone,
>
> Just want to take some expert opinion on the following problem.
>
> I have around 5-10 rows like mentioned below.
>
> Each of them have the same bg color except the one that would be  
> active.
>
> So, what I want to do is that when a particular header is clicked,  
> I want to
> change the bgcolor's of the 2 td's and flip the src of the img in  
> the first
> td.
>
> What would be the best way to do this as I want to traverse through  
> the
> tree, change the bgcolors and image of the one being clicked, but also
> change the image&bgcolors of all the rest to make sure they are not
> highlighted.
>
> Help would be appreciated.
>
> Thank you,
> Mandy.
>
> <ACTIVE>
>
> <tr>
>   <td bgcolor="#ffffff"><a href='#)'><img src="foo1_active.gif"  
> border="0"
> height="25" width="36"></a></td>
>   <td bgcolor="#ffffff">&nbsp;<a href='#'><b>Foo1</b></a></td>
> </tr>
>
> </ACTIVE>
>
> <tr>
>   <td bgcolor="#305daa"><a href='#)'><img src="foo2.gif" border="0"
> height="25" width="36"></a></td>
>   <td bgcolor="#305daa">&nbsp;<a href='#'><b>Foo2</b></a></td>
> </tr>
>
>
> <tr>
>   <td bgcolor="#305daa"><a href='#)'><img src="foo3.gif" border="0"
> height="25" width="36"></a></td>
>   <td bgcolor="#305daa">&nbsp;<a href='#'><b>Foo3</b></a></td>
> </tr>
>
>
> Unsubscribe
> [email protected]
>
> List info
> http://www.quirksmode.org/dom/list.html
> Yahoo! Groups Links
>
>
>
>
>
>
>
>
>
> Unsubscribe
> [email protected]
>
> List info
> http://www.quirksmode.org/dom/list.html
> Yahoo! Groups Links
>
>
>
>
>
>
>

Nicolas Cohen
Smile&Soft







[Non-text portions of this message have been removed]



Unsubscribe
[email protected]

List info
http://www.quirksmode.org/dom/list.html 
Yahoo! Groups Links

<*> To visit your group on the web, go to:
    http://groups.yahoo.com/group/wdf-dom/

<*> To unsubscribe from this group, send an email to:
    [email protected]

<*> Your use of Yahoo! Groups is subject to:
    http://docs.yahoo.com/info/terms/