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

Nicolas Cohen wrote:
> i know this might be off-topic, but you should try using css :hover  
> pseudo-class
>   

Hovering is not the same as clicking, which AFAIR was what the original 
request was for.

Here's what I do, given the structure:
<style>
    TR.myRowSelected {
       background-color: red;
    }
</style>
<table id="myTable">
<thead>
<tr>
<th></th>...
</tr>
</thead>
<tbody>
<tr>
<td></td>...
</tr>...
</tbody>
</table>

<script language="PseudoScript" type="text/pseudoscript">
// we're going to use some prototype style shortcuts here
window.myTable = $("myTable"); // we went this accessible from inside 
the onclick function
SELECTEDROWCLASS = "myRowSelected";
var myRows = myTable.getElementsByTagName("TR");
for (var i=0;myRows[i];i++) {
    myRows[i].onclick = function() {
        if (window.myTable.selectedRow) { // "unclick" if there's a 
selected row
          window.myTable.selectedRow.className = 
window.myTable.selectedRow.baseClassName;
        }
        if (!this.baseClassName) {this.baseClassName = this.className;} 
// set up the base css class
        this.className = this.baseClassName + " " + SELECTEDROWCLASS; // 
highlight the row
        window.myTable.selectedRow = this; // track the currently 
selected row
    }
}
</script>

there's some libraries out there (probably even in prototype) for more 
elegantly handling adding/removing classes, but that gives you the basic 
idea...

-- 
david gee ::: [email protected] ::: http://www.mode3.com/david 



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/