Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 12.04.2009, 23:15   #1
bogachev
Новичок
Джуниор
 
Регистрация: 12.04.2009
Сообщений: 1
По умолчанию при наведении на один текст, выделяется другой

а подскажите пожалуйста,как сделать на js (или другим инструментом) следующее: есть два столбца с текстом. Надо сделать так чтоб при наведении на текст в строчке одно столбца подсвечивались (выделялись жирным) необходимые строки в другом столбце
Пример (только на флеше) здесь: http://www.margecasey.com/
bogachev вне форума Ответить с цитированием
Старый 17.04.2009, 16:48   #2
RJ Presto
Пользователь
 
Регистрация: 02.04.2009
Сообщений: 17
По умолчанию

лови пример
форматирование простенькое, но механизм понятен

Код HTML:
<html>
<head>
  <title></title>
</head>
<body>
<script>
highlights={}
// индексы подсвечиваемых надписей при наведении на левый столбец
highlights.left={_0:[1,3],_1:[2,4],_2:[0,4],_3:[3],_4:[1,2,3]};
// индексы подсвечиваемых надписей при наведении на правый столбец
highlights.right={_0:[1,3],_1:[2,4],_2:[0,4],_3:[3],_4:[1,2,3]};
function MouseRollOverCell( cell_id ) {
	var side=cell_id.substr( 0, cell_id.indexOf( '_' ) );
	var h_side;
	if ( side == 'left' ) {
		h_side = 'right';
	} else {
		h_side = 'left';
	}
	var cell_num=cell_id.substr( cell_id.indexOf( '_' ) );
    for ( i = 0; i < highlights[side][cell_num].length; i++ ) {
        var h_cell=document.getElementById( h_side + '_' + String( highlights[side][cell_num][i] ) );
        // подсвечиваем
        h_cell.innerHTML = '<b><i>' + h_cell.innerText + '</i></b>';
    }
}

function MouseRollOutCell( cell_id ) {
	var side=cell_id.substr( 0, cell_id.indexOf( '_' ) );
	var h_side;
	if ( side == 'left' ) {
		h_side = 'right';
	} else {
		h_side = 'left';
	}
	var cell_num=cell_id.substr( cell_id.indexOf( '_' ) );
    for ( i = 0; i < highlights[side][cell_num].length; i++ ) {
        var h_cell=document.getElementById( h_side + '_' + String( highlights[side][cell_num][i] ) );
        // убираем подсветку
        h_cell.innerHTML = h_cell.innerText;
    }
}
</script>

<table border=1 width=200>
<tr height=25>
<td align=right id='left_0' onMouseOver='javascript: MouseRollOverCell("left_0")' onMouseOut='javascript: MouseRollOutCell("left_0")'>
слово 0 0
</td>
<td align=left id='right_0' onMouseOver='javascript: MouseRollOverCell("right_0")' onMouseOut='javascript: MouseRollOutCell("right_0")'>
слово 0 1
</td>
</tr>
<tr height=25>
<td align=right id='left_1' onMouseOver='javascript: MouseRollOverCell("left_1")' onMouseOut='javascript: MouseRollOutCell("left_1")'>
слово 1 0
</td>
<td align=left id='right_1' onMouseOver='javascript: MouseRollOverCell("right_1")' onMouseOut='javascript: MouseRollOutCell("right_1")'>
слово 1 1
</td>
</tr>
<tr height=25>
<td align=right id='left_2' onMouseOver='javascript: MouseRollOverCell("left_2")' onMouseOut='javascript: MouseRollOutCell("left_2")'>
слово 2 0
</td>
<td align=left id='right_2' onMouseOver='javascript: MouseRollOverCell("right_2")' onMouseOut='javascript: MouseRollOutCell("right_2")'>
слово 2 1
</td>
</tr>
<tr height=25>
<td align=right id='left_3' onMouseOver='javascript: MouseRollOverCell("left_3")' onMouseOut='javascript: MouseRollOutCell("left_3")'>
слово 3 0
</td>
<td align=left id='right_3' onMouseOver='javascript: MouseRollOverCell("right_3")' onMouseOut='javascript: MouseRollOutCell("right_3")'>
слово 3 1
</td>
</tr>
<tr height=25>
<td align=right id='left_4' onMouseOver='javascript: MouseRollOverCell("left_4")' onMouseOut='javascript: MouseRollOutCell("left_4")'>
слово 4 0
</td>
<td align=left id='right_4' onMouseOver='javascript: MouseRollOverCell("right_4")' onMouseOut='javascript: MouseRollOutCell("right_4")'>
слово 4 1
</td>
</tr>
</table>

</body>

</html>
RJ Presto вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение изображения при наведении мышки? lionman Общие вопросы Delphi 24 12.06.2010 13:03
получить значение ID при наведении мышкой badfilin JavaScript, Ajax 9 25.04.2009 19:35
увеличение излбражения при наведении курсора SKS HTML и CSS 4 08.03.2009 13:39
Звук при наведении мышки на ссылку BangBangFM HTML и CSS 5 07.09.2008 15:14
Выдвижение формы при наведении Stanislav Общие вопросы Delphi 11 24.08.2008 00:24