Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Подсвечивание строк таблицы при наведении мыши (https://javascript.ru/forum/events/75216-podsvechivanie-strok-tablicy-pri-navedenii-myshi.html)

kuchuluk 14.09.2018 06:12

Подсвечивание строк таблицы при наведении мыши
 
Здравствуйте. Есть таблица
<table>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td></td>
  </tr>
</table>

Нужно сделать подсвечивание строк при движении курсором по таблице, то есть чтобы при наведении на строку цвет фона менялся, а при уводе курсора с нее, возвращался на прежний цвет.
Данный код не работает:
document.querySelectorAll('tr').forEach(function(elem) {
  elem.onmouseover.style.backgroundColor = 'f00';
});

Белый шум 14.09.2018 07:14

Зачем тулить яваскрипт туда, с чем и цсс отлично справится?
<style>
  tr:hover > td { background:cyan; }
</style>
<table>
  <tr>
    <td>1</td><td>+</td>
  </tr>
  <tr>
    <td>2</td><td>+</td>
  </tr>
  <tr>
    <td>3</td><td>+</td>
  </tr>
  <tr>
    <td>4</td><td>+</td>
  </tr>
</table>

kuchuluk 14.09.2018 14:50

Хорошо, понял, спасибо :)


Часовой пояс GMT +3, время: 05:00.