change bgcolor on multiple rows

[shumway]

<tr onmouseover="this.bgColor='#AA2B4A'" onmouseout="this.bgColor='#000000'">

How do I translate this to highlight a specific column in 10 different rows on mouse over?

[gil davis]

I would give each cell a unique ID and write a function that changes each one.

[shumway]

Thats about 1800 objects (yeah - i know :) - isnt there any other way? please - i want it to be...

[gil davis]

Originally posted by shumway
Thats about 1800 objects (yeah - i know :) - isnt there any other way? please - i want it to be...

Want in one hand, spit in the other, then see which one fills up.;-)

DOM methods will allow you to walk through the document if you know what to look for. I suppose you could count rows and columns. If there is a fixed relationship between where the event occurs and the target of the desired effect, perhaps you could take advantage of that.

[shumway]

Well - im not really a javascript-programmer so i would have preferred if u had shown me a complete script but maybe thats asking too much :)

I can hardly be the first one wanting to make this...

Thanks anyway!
Dont know why u take time helping fools like me but its apreciated ;)

[gil davis]

Originally posted by shumway
Well - im not really a javascript-programmer so i would have preferred if u had shown me a complete script but maybe thats asking too much :)
You really didn't give me anything to work with. What you posted takes good advantage of the "this" object, and you can't use that to reference 10 other things. Your request was too vague (for me, at least).
I can hardly be the first one wanting to make this...
If you weren't, someone here would have been able to point you to an example, now couldn't they?
Thanks anyway!
Dont know why u take time helping fools like me but its apreciated ;)
There's no need to feel foolish.

[shumway]

Okey - this is what a want to do:

<style type="text/css">
#tblrow {cursor:hand}
#tblcol2 {background:#FFFFFF}
#tblcol1 {background:#FFFFFF}
</style>


<table border=1>
<tr id=tblrow onmouseover="this.bgColor='#AA2B4A'" onmouseout="this.bgColor='#FFFFFF'">
<td eid=tblcol1 onmouseover="tblcol1.style.background='#AA2B4A'" onmouseout="tblcol1.style.background='#FFFFFF'">Row 1 Col 1</td>
<td eid=tblcol2 onmouseover="tblcol2.style.background='#AA2B4A'" onmouseout="tblcol2.style.background='#FFFFFF'">Row 1 Col 2</td></tr>
<tr id=tblrow onmouseover="this.bgColor='#AA2B4A'" onmouseout="this.bgColor='#FFFFFF'">
<td eid=tblcol1 onmouseover="tblcol1.style.background='#AA2B4A'" onmouseout="tblcol1.style.background='#FFFFFF'">Row 2 Col 1</td>
<td eid=tblcol2 onmouseover="tblcol2.style.background='#AA2B4A'" onmouseout="tblcol2.style.background='#FFFFFF'">Row 2 Col 2</td></tr>
</table>

...but in a much larger scale.

[gil davis]

First, take advantage of classes:

<style type="text/css">
all.tblrow {cursor:hand}
all.tblcol {background:#FFFFFF}
</style>

Then some script:

<script>
function bgOn(obj, clr) {
obj.style.backgroundColor = clr;
}
</script>

Apply it this way:

<tr class="tblrow" onmouseover="bgOn(this, '#AA2B4A')" onmouseout="bgOn(this, '#FFFFFF')">
<td class="tblcol" onmouseover="bgOn(this, '#AA2B4A')" onmouseout="bgOn(this, '#FFFFFF')">Row 2 Col 1</td>

ID's have to be unique, and in this particular case are not necessary.

BTW, this will not function on NS 4.

[shumway]

Im afraid I dont make my self clear.

What I want is to change color on all cells in the same row and column as the cursor is over.

Lets say that the o's and x's are cells in a table and o means one color and x another - then it should look like this when the mouse is over the cell in row 5 column 4.

o o o x o o
o o o x o o
o o o x o o
o o o x o o
x x x x x x
o o o x o o

The code u gave me only changes color on the cell the mouse is over - at least thats how it worked when I implemented it.

[gil davis]

Im afraid I dont make my self clear.
You are a master of understatement. My reply was trying to make the problem you posted work, as your current response indicates.
The code u gave me only changes color on the cell the mouse is over - at least thats how it worked when I implemented it.
As designed, as I understood it.
What I want is to change color on all cells in the same row and column as the cursor is over.
Ok, then I go back to my first post, where I stated:
give each cell a unique ID
You can name them in such a way that you can calculate what each cell would be called. For example, "R1C1". All cells in row one would start with "R1" and each cell in column 1 would end with "C1". So if your mouseover occurred on "R3C12", you would march through the rows ("R1" thru "RXX") and change the color for each cell that ended with "C12". The only problem would be to know the last row available.

<script>
var numRows = 12; // change as required
function bgOn(obj, clr) {
for (var i=1; i<numRows; i++)
{document.getElementById("R" + i + obj).style.backgroundColor = clr;}
}
</script>
...
<tr class="tblrow" onmouseover="bgOn(this, '#AA2B4A')"
onmouseout="bgOn(this, '#FFFFFF')"> <td class="tblcol" id="R2C1" onmouseover="bgOn("C1", '#AA2B4A')" onmouseout="bgOn("C1", '#FFFFFF')">Row 2 Col 1</td>
...

[shumway]

Just one problem - when I set the color back to #FFFFFF on mouseout for the column that has higher prioritey than the color-setting on mouseover on the row - but I think I'll be able to solve this by my own now.

Many thanks once more!