про css2
Хотя вообще вопрос по части г-на Flying-а, он профи в области CSS ")
насколько мне известно, это возможно только средствами JavaScript
Хотя вообще вопрос по части г-на Flying-а, он профи в области CSS ")
а как к нему обратиться?
ЛЮДИ, помогите сделать так, чтобы при наведении на кусок таблицы менялся бакграунд и при сведении менялся на прежний. Я где-то видел скрипт на яве для этого дела, но нельзя ли это сделать средствами css2?
>3.14. Как сделать так, чтобы при наведении мышки какой-либо отличный от ссылки
>элемент (скажем, ячейка таблицы) поменял оформление (например, фоновый цвет)
Категорически не рекомендуется пользоваться скриптами типа
<td onmouseover="...">
В CSS2 псевдокласс :hover может быть применен не только к ссылке, но и
к любому другому элементу. Hо, к сожалению, IE не поддерживает эту
возможность. Поэтому поступаем так - пишем в стилях:
td{...styles...;behavior:url('td.htc');} /* работает в IE4+ */
td:hover{background-color:#RRGGBB;} /* стандарт CSS2, работает в NN6/Mozilla */
И создаем файл td.htc, в котором пишем:
<public:attach event="onmouseover" onevent="color()" />
<public:attach event="onmouseout" onevent="restore()" />
<script language="JavaScript" type="text/javascript"><!--
function color() {
runtimeStyle.backgroundColor='#RRGGBB';
}
function restore() {
runtimeStyle.backgroundColor='';
}
//--></script>
Теперь все ячейки таблиц при наведении мышки будут подсвечиваться.
Разумеется, можно использовать td.className:hover и td#idName:hover
для подсветки ячеек определенного стиля или конкретной ячейки.
© ru.html.chainik
насколько мне известно, это возможно только средствами JavaScript
Хотя вообще вопрос по части г-на Flying-а, он профи в области CSS ")
:)
А вообще подобная вещь действительно делается элементарно средствами CSS2 с использованием псевдо-класса :hover
Пример:
<head>
<style type="text/css">
#cell {background-image: url(normal.gif)}
#cell:hover {background-image: url(hover.gif)}
</style>
</head>
<body>
<table>
<tr>
<td id="cell" style="width: 100px; height: 50px">some text</td>
</tr>
</table>
</body>
</html>
Отлично работает в Mozilla и Opera 7, в IE работать не будет по причине того, что в нем :hover разрешен только для ссылок (подробнее - на сайте Microsoft)
<td onMouseout="this.style.backgroundColor='#660066';" onMouseover="this.style.backgroundColor='#cc00cc';">
Работает везде...
Всё можно сделать еще проще...
<tdonMouseout="this.style.backgroundColor='#660066';" onMouseover="this.style.backgroundColor='#cc00cc';">
Работает везде...
а че тогда в приведенном Tdr'ом куске нарисанно
Категорически не рекомендуется пользоваться скриптами типа
<td onmouseover="...">
а?
просто представь себе таблицу с необходимостью подсветки 100 ячеек. не затрахаешься ли, милый друг? к тому же огромный код, загруженность js-выполнения и т.д.
да я же не против, ..... скажи, мне всетаки через .htc делать?