Вот написал функцию:
<script>
function ChangeColor(obj, col)
{
obj.style.background=col;
}
</script>
Делаю таблицу и засовываю этот скрипт в onmouseover/onmouseout:
<center>
<table width="40%" cellspacing="3" cellpadding="5" border="7" style="background: black;"
onmouseover="ChangeColor(this, 'red');" onmouseout="ChangeColor(this, 'green');">
<tr><td>
Йа тобличко! :3
</td></tr></table>
</center>
На мышь реагирует как и задуманно... А теперь внутрь добавляю ещё такую же табличку:
<center>
<table width="40%" cellspacing="3" cellpadding="5" border="7" style="background: black;"
onmouseover="ChangeColor(this, 'red');" onmouseout="ChangeColor(this, 'green');">
<tr><td>
Йа тобличко! :3
<table width="40%" cellspacing="3" cellpadding="5" border="7" style="background: white;"
onmouseover="ChangeColor(this, 'blue');" onmouseout="ChangeColor(this, 'yellow');">
<tr><td>Йа тобличко! :3</td></tr></table>
</td></tr></table>
</center>
Вроде тоже всё логично... А вот теперь делаю внутренней табличке position absolute:
<center>
<table width="40%" cellspacing="3" cellpadding="5" border="7" style="background: black;"
onmouseover="ChangeColor(this, 'red');" onmouseout="ChangeColor(this, 'green');">
<tr><td>Йа тобличко! :3
<table width="40%" cellspacing="3" cellpadding="5" border="7" style="background: white; position: absolute; left: 0px; top: 0px;"
onmouseover="ChangeColor(this, 'blue');" onmouseout="ChangeColor(this, 'yellow');">
<tr><td>Йа тобличко! :3</td></tr></table>
</td></tr></table>
</center>
И вот получается что внутренняя табличка вовсе не внутри главной, а чёрти-где... Но (!) если навести мышкой на внутреннюю (которая визуально уже не внутри) - цвет обе меняют (то есть функция дважды вызывается, для обеих таблиц)...
А собственно вопрос - оно
всегда и
во всех браузерах так будет?
(да, я дурак )