Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Hover в Internet Explorer
 
 автор: CBE4KuH   (12.02.2009 в 23:39)   письмо автору
 
 

Товарищи, подскажите как выйти из положения когда ослик частично понимает свойство CSS hover. Осёл его обрабатывает только для ссылок, а у меня это свойство применяется к ячейке таблицы. При наведении меняется цвет фона ячейки.
Onmouseover не предлагать так как лагает при быстром перемещении мышки...
Заранее всем спасибо!

  Ответить  
 
 автор: AlexSol   (12.02.2009 в 23:54)   письмо автору
 
   для: CBE4KuH   (12.02.2009 в 23:39)
 

1 hover только для ссылок
2 Onmouseover для всего остального

  Ответить  
 
 автор: CBE4KuH   (13.02.2009 в 00:00)   письмо автору
 
   для: AlexSol   (12.02.2009 в 23:54)
 

А можно как-то в данном случае без onmouseover обойтись? Уж больно он глючит.... А точнее функция onmouseout для снятия эффектов при снятии курсора...

  Ответить  
 
 автор: AlexSol   (13.02.2009 в 12:10)   письмо автору
 
   для: CBE4KuH   (13.02.2009 в 00:00)
 

приводите ваш скрипт

  Ответить  
 
 автор: CBE4KuH   (14.02.2009 в 01:41)   письмо автору
 
   для: 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;
}

  Ответить  
 
 автор: PAT   (14.02.2009 в 02:31)   письмо автору
 
   для: 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> 

  Ответить  
 
 автор: CBE4KuH   (14.02.2009 в 14:18)   письмо автору
 
   для: PAT   (14.02.2009 в 02:31)
 

Спасибо большое! Объяснение, так сказать, на пальцах и для чайника! Ещё раз спасибо! ;)

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования