Форум dkLab и Denwer
Здесь общаются Web-разработчики.
Генеральный спонсор:
Хостинг «Джино»

Использование onMouseOver/onMouseOut в не inline-подстановке (Austin)
Author Message
Austin
Guest





Карма: 388
   поощрить/наказать


PostPosted: Tue May 01, 2007 11:56 am (написано за 39 секунд)
   Post subject: Использование onMouseOver/onMouseOut в не inline-подстановке
Reply with quote

Есть такая строка в таблице (это таблица Менделеева):
Code (html): скопировать код в буфер обмена
<tr> (december.com/html/4/element/tr.html)
        <td (december.com/html/4/element/td.html) class="period-group"> (december.com/html/4/element/.html)III</td>
        <td (december.com/html/4/element/td.html) class="selem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FF9D9D'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)11</sub>Na</td>
        <td (december.com/html/4/element/td.html) class="selem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FF9D9D'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)12</sub>Mg</td>
        <td (december.com/html/4/element/td.html) colspan="10"> (december.com/html/4/element/.html)</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)13</sub>Al</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)14</sub>Si</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)15</sub>P</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)16</sub>S</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)17</sub>Cl</td>
        <td (december.com/html/4/element/td.html) class="pelem" onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#FFFFC1'"> (december.com/html/4/element/.html)<sub> (december.com/html/4/element/sub.html)18</sub>Ar</td>
</tr>
Ячейки классов pelem и selem по-разному окрашены. При наведении должны менять цвет, при уходе мыши - цвет меняется на начальный. В inline-подстановке все работает, но как привязать скрипт к элементу определенного класса? Мне кажется, что должен быть более стройный вариант, но я новичок и пока не совсем понимаю как это можно сделать. Помогите разобраться.
Back to top
WingedFox
Профессионал



Joined: 29 Apr 2003
Posts: 4064
Карма: 268
   поощрить/наказать

Location: Питер

PostPosted: Tue May 01, 2007 12:54 pm (спустя 58 минут; написано за 3 минуты 14 секунд)
   Post subject:
Reply with quote

Самый простой способ -- положить в ячейку якорь (<a>) и в CSS определить для него класс :hover
Другой -- определить :hover для td, для IE подключить соотв. behavior (эмуляцию :hover)
Третий -- найти функцию getElementsByClass
Back to top
View user's profile Send private message
Austin
Guest





Карма: 388
   поощрить/наказать


PostPosted: Wed May 02, 2007 4:32 pm (спустя 1 день 3 часа 37 минут; написано за 4 минуты 12 секунд)
   Post subject:
Reply with quote

WingedFox, спасибо! Решил проблему самым простым - первым способом. Третим немного непонятно как завязать это все в один узел - то запятая, то еще что-то, вобщем буду разбираться. Удивительно, что getElementsByClass не является встроенной JS-функцией!

Вопрос решен, тему можно закрыть.
Back to top
AKS
Участник форума



Joined: 28 Dec 2005
Posts: 1174
Карма: 102
   поощрить/наказать


PostPosted: Wed May 02, 2007 4:45 pm (спустя 13 минут; написано за 52 секунды)
   Post subject:
Reply with quote

А мне второй способ показался самым простым и естественным...
Back to top
View user's profile Send private message Send e-mail
Display posts from previous:   
Post new topic   Reply to topic All times are GMT + 3 Hours
Page 1 of 1    Email to a Friend.
You cannot post new topics in this forum. You cannot reply to topics in this forum. You cannot edit your posts in this forum. You cannot delete your posts in this forum. You cannot vote in polls in this forum. You cannot attach files in this forum. You can download files in this forum.
XML