IE and onMouseOver issues

Trying to set background color with onMouseOver

[Lang]

Hey,

I create a table using DOM - I get it all working in both IE and Firefox.

However IE does not like this bit:

var row = document.createElement("tr");
row.setAttribute('onMouseOver', 'changeColor(this, "#C0C0C0")');
row.setAttribute('onMouseOut', 'changeColor(this, "#FFFFFF")');

Both Firefox and IE will not throw an error at the code but only Firefox correctly displays the MouseOver and MouseOut effects. IE does not.

changeColor

function changeColor(object, color){
object.style.backgroundColor = color;
}

Anyone know why this is?

Thanks,
Lang

[Fotiman]

1. Your attribute values should be all lowercase, as in 'onmouseover' instead of 'onMouseOver'.
2. IE does not support setting the event handler methods using setAttribute. Try this:

row.onmouseover = function () {
  changeColor(row, '#c0c0c0');
};
row.onmouseout = function () {
  changeColor(row, '#fff');
}