Dynamically change bgColor of table cell?

kj · Feb 11, 2004

Is there a way to dynamically (e.g. upon onClick) change the bgColor
attribute of a table cell? I tried cell.setAttribute("bgColor",
someColor), where someColor was a string of the form "#RRGGBB",
but nothing happened.

Also, how can I set the mouse cursor to be an arrow when it hovers
over these table cells? (It's an insertion bar now.)

Thanks!

kj

Michael Winter · Feb 12, 2004

Is there a way to dynamically (e.g. upon onClick) change the bgColor
attribute of a table cell? I tried cell.setAttribute("bgColor",
someColor), where someColor was a string of the form "#RRGGBB",
but nothing happened.

Try

cell.style.backgroundColor = '#rrggbb';

Also, how can I set the mouse cursor to be an arrow when it hovers
over these table cells? (It's an insertion bar now.)

You can use CSS to do this.

<style type="text/css">
td {
cursor: default;
}
</style>

This will make the cursor display as the default shape (an arrow, usually)
over all table cells, assuming the cursor property is supported. If you
want to be more selective, change the selector to include a class.

Mike

McKirahan · Feb 12, 2004

kj said:
Is there a way to dynamically (e.g. upon onClick) change the bgColor
attribute of a table cell? I tried cell.setAttribute("bgColor",
someColor), where someColor was a string of the form "#RRGGBB",
but nothing happened.

Also, how can I set the mouse cursor to be an arrow when it hovers
over these table cells? (It's an insertion bar now.)

Thanks!

kj

Will this help?

<html>
<head>
<title>cellfunc.htm</title>
<script type="text/javascript">
function doit(that,what) {
if (what != "") {
that.style.cursor = what;
} else {
that.style.background = "yellow";
}
}
</script>
</head>
<body>
<table border="1" width="200" height="200">
<tr valign="top">
<td id="cell1"
onmouseover="doit(this,'hand')"
onmouseout="doit(this,'auto')"
onclick="doit(this,'')">
<br> blah, blah, blah, blah, blah...
</td>
</tr>
</table>
</body>
</html>

McKirahan · Feb 12, 2004

kj said:
Is there a way to dynamically (e.g. upon onClick) change the bgColor
attribute of a table cell? I tried cell.setAttribute("bgColor",
someColor), where someColor was a string of the form "#RRGGBB",
but nothing happened.

Also, how can I set the mouse cursor to be an arrow when it hovers
over these table cells? (It's an insertion bar now.)

Thanks!

kj

Cool!

One problem: I get #666 when I should get "black".

P.S. I modified one line to display the color on the status bar:

<div id="g1" onmouseout="window.status=''"
onmouseover="window.status=window.event.srcElement.strokeColor"
onclick="alert(window.event.srcElement.strokeColor)"></div>

This lets the user see the color without having to click.

Where did you learn about this vml stuff?

kj · Feb 12, 2004

Thanks. That worked great.

One tiny remaining problem is that even though the cursor is no
longer an text insertion cursor, it can select text. If the mouse
moves slightly when one clicks on a cell, some text gets selected.
Is there any way to prevent this from happening?

Thanks!

kj

McKirahan · Feb 12, 2004

McKirahan said:
Cool!

One problem: I get #666 when I should get "black".

[snip]

Sorry for the above message; it was for another thread...

bgcolor from a 'this'	15	Jul 11, 2005
DYnamically setting the vertical alignment for cell/rows	2	Oct 31, 2005
Help needed dynamically accessing table cell values	2	Oct 31, 2007
Can not seem to alter table row bgcolor using DOM	0	Feb 24, 2004
Dynamically changing cell values with Javascript / Ajax	3	Apr 13, 2009
image rollover inside a table cell, please..	2	Nov 13, 2006
Swapping bgcolor in table cell	5	Aug 8, 2005
Dropdown cell in table	3	Jun 19, 2008

Dynamically change bgColor of table cell?

kj

Michael Winter

McKirahan

McKirahan

kj

McKirahan

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads