Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.04.2009, 03:12
Интересующийся
Отправить личное сообщение для Tend Посмотреть профиль Найти все сообщения от Tend
 
Регистрация: 16.03.2009
Сообщений: 13

Подсветка выделенной строки в таблице - как сделать в этом случае?
Есть код:
<style>
.t td { background-color: #ffddff; }
</style>

<script>
function over(id) { id.style.background = '#ffeeff'; }
function out(id) { id.style.background = '#ffffff'; }
</script>

<table class=t>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
</tr>
</table>


Без стиля ".t td { background-color: #ffddff; }" все работает, но этот стиль обязателен.
Как сделать, чтобы и стиль был, и смена подсветки работала?
Ответить с цитированием
  #2 (permalink)  
Старый 14.04.2009, 08:41
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 04.04.2008
Сообщений: 6,246

Разобрался.
внутри CSS вы задаете свойство у ячеек, внутри функций вы пытаетесь его переопределитть для всего ряда.ряд и ячейка-немного разные объекты.соответсвенно фоновый цвет ячейки является более приоритетным, потому что ячейка находится поверх объекта ряд
нашел два способа решения вашей проблемы(второй случайно):
1)
<style>
.t td { background-color: #ffddff; }
</style>
 
<script>
function over(id)
	{
	for(i=0;i<id.cells.length;i++)
		id.cells[i].style.backgroundColor = '#ffeeff';
	}
function out(id)
	{
	for(i=0;i<id.cells.length;i++)
		id.cells[i].style.backgroundColor = '#ffffff';
	}
</script>
 
<table class=t>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
</tr>
</table>

2)
<style>
.t tr { background-color: #ffddff; }
</style>
 
<script>
function over(id)
	{
	id.style.backgroundColor = '#ffeeff';
	}
function out(id)
	{
	id.style.backgroundColor = '#ffffff';
	}
</script>
 
<table class=t>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
<tr onmouseover="over(this);" onmouseout="out(this);">
<td>1234567890</td>
<td>1234567890</td>
</tr>
</table>


PS насчет кросбраузерности ничего не могу сказать. Это не мой конек, к сожалению.но во всех трех моих браузерах все норм(опера, осел, лиса)
Ответить с цитированием
  #3 (permalink)  
Старый 14.04.2009, 16:52
Интересующийся
Отправить личное сообщение для Tend Посмотреть профиль Найти все сообщения от Tend
 
Регистрация: 16.03.2009
Сообщений: 13

Gvozd,
благодарю!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подсветка выделенной строки в таблице (row table highlight) artsage Элементы интерфейса 4 03.04.2009 06:40