bnku Сообщение 02/09/2010 20:33 Копия темы
как реализовать сложный :hover? Привет друзья, коллеги.

Есть конструкция
<td class="a">tratata</td>
<td class="b">lalala</td>

хочу, что бы при наведении на ячейку .b, к ячейке .a добавлялся класс, например .c.

то, есть, при наведении на определенный элемент, мне надо видоизменять другой элемент.
желательно, решить это на jQ.
помогите разобраться, ребзя :)

bnku Сообщение 02/09/2010 20:33 Копия темы
еще, id ячейкам задавать нельзя – их там миллион :).

bnku Сообщение 02/09/2010 20:39 Копия темы
т.е., на самом деле конструкция такая:
<table>

<tr>
<td class="a"></td>
<td></td>
<td class="a"></td>
<td></td>
<td class="a"></td>
</tr>

<tr>
<td class="b"></td>
<td></td>
<td class="b"></td>
<td></td>
<td class="b"></td>
</tr>

</table>

и вот надо при наведении на ячейку .b, подсвечивать соответствующую ячейку .a (ту, что над ней)
%)

bnku Сообщение 02/09/2010 20:41 Копия темы

Zulus Сообщение 02/09/2010 20:44 Копия темы
td.b:hover .c {..}
ну и  вкоде
<td class="b с"></td> 

ну и можно и без класса

td.b:hover {..}
ну и  вкоде
<td class="b"></td> 

для ие6 надо hover.htc

bnku Сообщение 02/09/2010 20:48 Копия темы
делаем так:

$(document).ready(function(){
        $('.b').hover(
            function() {
                $('.a').addClass('c');
            },
            function() {
                $('.a').removeClass('c');
            }
        );    
});

а как посчитать нужный элемент с классом .a, к которому добавлять .c?

bnku Сообщение 02/09/2010 20:49 Копия темы
не, вы не поняли. мне надо при наведении на .b, видоизменять .a

bnku Сообщение 02/09/2010 20:50 Копия темы
td.b:hover .c {..}
ну и  вкоде
<td class="b с"></td>  

а это вообще не рабочий код. точнее, не имеющий смысла.

Zulus Сообщение 02/09/2010 20:51 Копия темы
да, сорри. не увидел .a, тут только js вроде

bnku Сообщение 02/09/2010 21:05 Копия темы
разобрался
сделал, используя index()

T0rnad0 Сообщение 02/09/2010 21:08 Копия темы
ты обращайся еще есличо))

bnku Сообщение 02/09/2010 21:16 Копия темы
океюшки ))

m6ma Сообщение 02/09/2010 21:18 Копия темы
Можно еще prev и next использовать, у вас же ячейки друг за другом идут.

bnku Сообщение 02/09/2010 21:23 Копия темы
не, смотри второй коммент, они в разных строках.

ElisDN Сообщение 02/09/2010 21:47 Копия темы
Упс...

bnku Сообщение 02/09/2010 21:49 Копия темы
не успел :)

ElisDN Сообщение 02/09/2010 21:56 Копия темы
«ты обращайся еще есличо))» ©

Xap4o Сообщение 03/09/2010 03:46 Копия темы
рад был тебе помочь, потом расчитаешся за мою работу =)
сам задал вопрос и сам ответил =)

vlad43 Сообщение 03/09/2010 05:45 Копия темы
а можно итоговый код? интересно )

bnku Сообщение 03/09/2010 12:48 Копия темы
как-то так <table>

<tr>
<td class="a"></td>
<td></td>
<td class="a"></td>
<td></td>
<td class="a"></td>
</tr>

<tr>
<td class="b"></td>
<td></td>
<td class="b"></td>
<td></td>
<td class="b"></td>
</tr>

</table>

$(document).ready(function(){
        $('.b').hover(
            function() {
                var nmb = $('.b').index(this);
                $('.a').eq(nmb).addClass('hover');
            },
            function() {
                $('.a').removeClass('hover');
            }
        );    
});

robertmailz Сообщение 05/09/2010 00:39 Копия темы
По классу выборка медленная. Тем более, что вы говорите что элементов много – низя, попа будет...

Лучшее решение – присвоить ID. 

robertmailz Сообщение 05/09/2010 00:40 Копия темы
Поясню... если ячеек "миллион"  – ТЕМ БОЛЕЕ НАДО давать ID

bnku Сообщение 05/09/2010 10:53 Копия темы
ну, миллион – это я образно. ячеек получилось не больше 20. работает быстро, нареканий нету. кода получилось в 20 раз меньше, чем было бы с id.

robertmailz Сообщение 11/09/2010 17:28 Копия темы
при 20 ячейках нет смысла поднимать вопрос об оптимизации производительности

bnku Сообщение 13/09/2010 04:20 Копия темы
я поднял вопрос по оптимизации кода, а не производительности.