Перетаскивание заголовка заголовка таблицы изменения цвета

Question

Привет У меня есть заполненный php стол, который имеет альтернативные цвета строк и прекрасно работает, теперь я пытаюсь изменить цвет текста в строке таблицы при его подсвечивании.

В приведенном ниже коде показано выделение таблицы, которое отлично работает, но я не могу изменить элемент цвета.

<tr class="active" bgcolor="#363636" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#363636';" onMouseOver="this.color='#fff';"> 

Answer 1

У вас есть две конфликтующих onMouseOver атрибутов. Вместо этого, почему бы не использовать псевдокскласс :hover?

tr { 
    background-color: #363636; 
} 

tr:hover { 
    background-color: gold; 
    color: #ffffff; 
} 

Если вы действительно хотите использовать onMouseOver, вы можете сделать это:

oneMouseOver="this.bgColor='gold'; this.color='#ffffff';"; 

Answer 2

Используйте this.style.color вместо this.color, и вы можете установить все это в одном атрибуте:

onMouseOver="this.bgColor='gold'; this.style.color='#fff';" 

Кстати попытаться избежать инлайн Javascript так, поэтому у вас есть разделение между HTML/css и ваш код javascript.

Answer 3

Вы можете использовать CSS:

tr:hover { 
    color: White; 
} 

Все ваши вопросы может быть переделан с CSS

tr { 
    background-color: #363636; 
} 

tr:hover { 
    background-color: Gold; 
    color: White; 
} 

Answer 4

В зависимости, если у вас есть несколько столбцов в каждой строке вы можете обновить стиль текста в несколько различных способов. Я тестировал оба из них в JSFiddle, и они оба работают.

Если вы хотите только цвет обновляется, когда конкретная ячейка наведении мышки:

<tr class="active" bgcolor="#363636" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#363636';" > 
     <td onMouseOver="this.style.color='#fff';" onMouseOut="this.style.color='#000';"> 
     hey 
     </td> 
    </tr> 

и если вы хотите цвет обновляется, когда любая ячейка в строке наведении мышки:

<tr class="active" bgcolor="#363636" 
    onMouseOver="this.bgColor='gold';this.style.color='#fff';" 
    onMouseOut="this.bgColor='#363636';this.style.color='#000';">