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"> <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"> <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"> <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/