background-color ячейки таблицы
Вроде должно как быть - при наведении мыши цвет фона меняется, а НЕТ!! Не работает. Подскажите пожалуйста что не так...
<table width="200" border="0" cellspacing="0" cellpadding="0" > <tr> <td id="one" onmouseover="color-change()" style="background-color:#FF9f00">Превед, Медведко </td> </tr> <tr> </table> <script> function color-change () { leon = event.srcElement.id document.getElementByID(leon).style.backgroundColor = '#FF0000' } </script> |
Во-первых у вас написано onMouseOver="color минус результат функции change()". Кроме того, нет нужды лопатить DOM если функция при событии вызывается из элемента, с которым мы работаем.
<table width="200" border="0" cellspacing="0" cellpadding="0" > <tr> <td id="one" onmouseover="color_change(this)" style="background-color:#FF9f00">Превед, Медведко </td> </tr> <tr> </table> <script> function color_change(elem) { elem.style.backgroundColor = '#FF0000'; } </script> |
А this - это ссылка на текущий элемент?? Разобраться бы в этой объектности и методах блин. У меня учебник такой корявый....
|
Относительно onmouseover="color_change(this)" this - ссылка на объект элемента td. Прочитайте про this тут, там довольно доходчиво.
|
Это конечно хорошо, а как быть если такая ячейка не одна? Прописать на каждую процедуру как-то не красиво будет. Подскажите пожалуйста как решить такую проблему.
|
прописать обработчик на таблицу, а текущую ячейку брать из e.target||e.srcElement
|
Все ясно, спасибо, буду пробовать.
|
C ячейкой разобрался, но никак не пойму как сделать, что бы выделить строку целиком. Подскажите пожалуйста, кто знает.
|
выделить щелчком или при наведении чтоб выделялась цветом?
если второе то на строку можно просто поставить класс и в css написать: .test_tr {background-color: #ccc} .test_tr:hover {background-color: #ccc333} |
twolf,
Не будет работать в Internet Explorer, в котором псевдокласс hover может быть только для ссылок. |
Часовой пояс GMT +3, время: 20:24. |