|
|
|
| Товарищи, подскажите как выйти из положения когда ослик частично понимает свойство CSS hover. Осёл его обрабатывает только для ссылок, а у меня это свойство применяется к ячейке таблицы. При наведении меняется цвет фона ячейки.
Onmouseover не предлагать так как лагает при быстром перемещении мышки...
Заранее всем спасибо! | |
|
|
|
|
|
|
|
для: CBE4KuH
(12.02.2009 в 23:39)
| | 1 hover только для ссылок
2 Onmouseover для всего остального | |
|
|
|
|
|
|
|
для: AlexSol
(12.02.2009 в 23:54)
| | А можно как-то в данном случае без onmouseover обойтись? Уж больно он глючит.... А точнее функция onmouseout для снятия эффектов при снятии курсора... | |
|
|
|
|
|
|
|
для: CBE4KuH
(13.02.2009 в 00:00)
| | приводите ваш скрипт | |
|
|
|
|
|
|
|
для: AlexSol
(13.02.2009 в 12:10)
| | Вот кусок исходника:
<table border="0" cellpadding="0" cellspacing="8" width="100%">
<tr style="height: 150px;">
<td colspan="2" align="center" class="info_td" onclick="location.href = './main_info/';">
<p class="h1"><b>Общая информация</b></p>
(Читать всем!)
</td>
</tr>
<tr style="height: 150px;">
<td align="center" width="50%" class="film_td" onclick="location.href = './films/';">
<p class="h1"><b>Сервер фильмов</b></p>
</td>
<td align="center" width="50%" class="chat_td" onclick="location.href = './chat/';">
<p class="h1"><b>Сервер чата</b></p>
</td>
</tr>
</table>
|
А вот кусок CSS:
.film_td{
border:1px dashed #000;
color: #808080;
cursor:pointer;
}
.chat_td{
border:1px dashed #000;
color: #808080;
cursor:pointer;
}
.info_td{
border:1px dashed #000;
color: #808080;
cursor:pointer;
}
.film_td:hover{
background-color: #C0D9FB;
cursor:pointer;
color: #8080C0;
}
.chat_td:hover{
background-color: #C0D9FB;
cursor:pointer;
color: #8080C0;
}
.info_td:hover{
background-color: #C0D9FB;
cursor:pointer;
color: #8080C0;
}
|
| |
|
|
|
|
|
|
|
для: CBE4KuH
(14.02.2009 в 01:41)
| | А если чуть-чуть подумать, то ваши тридцать строк CSS легко превращаются... "в элегантные шорты",
т.е. всего в девять строчек. Подсказываю: имена классов можно группировать.
Итого получим:
.film_td, .chat_td, .info_td, .film_td:hover, .chat_td:hover, .info_td:hover {
border: 1px dashed #000;
color: #808080;
cursor: pointer;
}
.film_td:hover, .chat_td:hover, .info_td:hover {
background-color: #C0D9FB;
border: none;
}
| Самое смешное, что и это можно подсократить - ибо НАХРЕНА КОЗЕ БАЯН?
Т.е., зачем иметь ТРИ РАЗНЫХ имени класса, если параметры этих классов абсолютно одинаковы?
Если ещё чуть-чуть поднапрячь мозговые извилины, то станет ясно, что
три тега <p>, три тега <b> и один класс .h1 у вас абсолютно лишние.
Все это можно заменить одним DIV'ом. Подсказываю:
1. вместо <b> в классе для ячеек пропишите font-weight: bold;
2. стили, кои прописаны у вас в классе .h1 пропишите в том же классе для ячеек.
3. "Читать всем!" поместите в DIV, для которого укажите нужные стили.
Что до "глюкавости" onmouseOVER/OUT, то тут вас кто-то обманул.
Если НОРМАЛЬНО сделать (без лишних заморок, как в данном случае), то ничего глючить не будет.
Держите. И двигайте мышью хоть со скоростью света:
<style>
.my_td, .my_td_hover{
border: 1px dashed #000;
color: #808080;
cursor: pointer;
font-weight: bold;
/* и чего-то ещё из класса h1 */
}
.my_td_hover {
background-color: #C0D9FB;
border: none;
}
.blam {
/* для "Читать всем" */
}
</style>
<table border="0" cellpadding="0" cellspacing="8" width="100%">
<tr style="height: 150px;">
<td colspan="2" align="center" class="my_td" onclick="location.href = './main_info/';" onmouseover="this.className = 'my_td_hover'" onmouseout="this.className = 'my_td'">
Общая информация<div class="blam">(Читать всем!)</div>
</td>
</tr>
<tr style="height: 150px;">
<td align="center" width="50%" class="my_td" onclick="location.href = './films/';" onmouseover="this.className = 'my_td_hover'" onmouseout="this.className = 'my_td'">
Сервер фильмов
</td>
<td align="center" width="50%" class="my_td" onclick="location.href = './chat/';" onmouseover="this.className = 'my_td_hover'" onmouseout="this.className = 'my_td'">
Сервер чата
</td>
</tr>
</table>
|
| |
|
|
|
|
|
|
|
для: PAT
(14.02.2009 в 02:31)
| | Спасибо большое! Объяснение, так сказать, на пальцах и для чайника! Ещё раз спасибо! ;) | |
|
|
|