VPF::[HTML | JS] Изменение первой ячейки

Guedda

Дата 26.7.2007, 23:11 (ссылка)

(нет голосов)

Загрузка ...

Подрывник

Профиль
Группа: Завсегдатай
Сообщений: 3137
Регистрация: 27.12.2005
Где: Ростов-на-Дону

Репутация: 6
Всего: 78

Есть таблица, приблизительно такого содержания:

Код


<table>
<tr>
  <td width="20" height="20"><img src="images/var_1.gif" /></td>
  <td width="100" height="20"><a href="http://mysite.com">Ссылка</a></td>
</tr>
</table>

Как мне при наведении на ссылку изменить картинку с var_1 на var_2? Возможно ли это именно в таблице, а не в блоке?

Заранее благодарен.

--------------------

Ll 2

SelenIT

Дата 27.7.2007, 00:45 (ссылка)

(нет голосов)

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 5
Всего: 401

Guedda, конечно можно. Javascript-у не важно, в таблице картинка или нет. Вопрос лишь в том, как к ней обратиться. Вариантов масса:

Код


<script>
function ch_img(id, file) {
    document.getElementById(id).src = 'images/' + file + '.gif';
}
</script>
.....
  <td width="20" height="20"><img src="images/var_1.gif" id="img1" /></td>
  <td width="100" height="20"><a href="http://mysite.com" onmouseover="ch_img('img1', 'var_2')" onmouseout="ch_img('img1',  'var_1')">Ссылка</a></td>

или (напр., если нужен одинаковый эффект для многих строк и нет возможности генерировать уникальные id-ы для каждой картинки):

Код


<script>
function ch_img(link, file) {
    var img = link.parentNode.parentNode.getElementsByTagName('img')[0]; // первая картинка в TR-ке со ссылкой
    img.src = 'images/' + file + '.gif';
}
</script>
.....
  <td width="20" height="20"><img src="images/var_1.gif" /></td>
  <td width="100" height="20"><a href="http://mysite.com" onmouseover="ch_img(this, 'var_2')" onmouseout="ch_img(this,  'var_1')">Ссылка</a></td>

Но все-таки, неужели непременно необходима таблица? CSS-способ точно не подходит?

--------------------

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Guedda

Дата 27.7.2007, 08:51 (ссылка)

(нет голосов)

Загрузка ...

Подрывник

Профиль
Группа: Завсегдатай
Сообщений: 3137
Регистрация: 27.12.2005
Где: Ростов-на-Дону

Репутация: 6
Всего: 78

Код


<script language="JavaScript">
function ch_img(id, file) {
    document.getElementById(id).src = 'images/' + file + '.gif';
}
</script>
.....
  <td width="20" height="20"><img src="images/var_1.gif" id="img1" /></td>
  <td width="100" height="20"><a href="http://mysite.com" onmouseover="ch_img('img1', 'var_2')" onmouseout="ch_img('img1',  'var_1')">Ссылка</a></td>

Везде работает, кроме IE :( Что делать?

--------------------

Ll 2

Guedda

Дата 27.7.2007, 09:33 (ссылка)

(нет голосов)

Загрузка ...

Подрывник

Профиль
Группа: Завсегдатай
Сообщений: 3137
Регистрация: 27.12.2005
Где: Ростов-на-Дону

Репутация: 6
Всего: 78

Извиняюсь, просто в IE была отключена JS.

--------------------

Ll 2

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Центр помощи \| Следующая тема »