CSS: hover для любого элемента

Всего оставлено 22 комментария

1. Yukki Pospel 2 июля 2004 ∞

   Если мне память не изменяет, у Зелдмана на alistapart.com была статья по-этому поводу и улучшенный метод.

2. Никита 6 июля 2004 ∞

   Память изменяет. Все говорят о методе whatever:hover как о самом достойном и функциональном.

3. Сергей 12 сентября 2006 ∞

   Все подключил, а на IE всеравно ничего не работает… У меня hover используется для тегов div, надо ли добовлять чего-нибудь в мой css код?

4. Theo 12 сентября 2006 ∞

   Сергей, зайди на
   http://www.xs4all.nl/~peterned/csshover.html
   и почитай. Скачай новую версию. У меня заработало сразу для li:hover-элементов.

5. Neoline 18 октября 2006 ∞

   Подключил, все работает !!!
   Ура, наконец-то можно наполную заюзать CSS

6. tobto 19 января 2007 ∞

   спасибо за инфо! долго искал решение и нашел. скачал, поставил – работает. css forever!

7. Максим 25 января 2007 ∞

   работает с большими тормозами!

8. int13h 13 апреля 2007 ∞

   >> работает с большими тормозами!
   на смартфоне тестил? 😉

9. TyShkan 30 апреля 2007 ∞

   И вправду ужасно тормозит, когда текста много на странице ~107Кб напичканного тегами. Все ховеры начинают тормозить жутко. IE начинает хавать 20-30% ресурсов (Athlon 42 X2 4200+, 1024Mb).

   Есть какое-нибудь удобоваримое решение как этого избежать?

10. Андрей 9 мая 2007 ∞

    Есть. Избегать использования htc.

11. Дима 15 июля 2007 ∞

    Скажите как использовать a:hover {background-color: #c20000; text-decoration:none; color: #fff;} КУДА ВСТАВИТЬ этот код можно в html, чтобы селектор работал.. при на ведении мыши на ссылку она подсвечивалась?

12. Lis 23 августа 2007 ∞

    > а я такою юзаю. тормозов нет
    И работает такое чудо только в IE

13. Antoha 26 сентября 2007 ∞

    Метод хороший, но не решает всех проблем.
    Так, например, на больших и сложных документах сам IE даже для стандартного a:hover отжирает 100% (!) проца.

    Да и вообще, довольно плохо IE работает с динамическим изменением класса.

    Например, опять же, на больших документах css-конструкция:

    a:hover {
    text-decoration: underline;
    }
    работает гораздо медленее (в разы!), плюс грузит проц на 100%, чем

    <a onmouseover="this.style.textDecoration='underline';" onmouseout="this.style.textDecoration='none';" rel="nofollow">...

    В Mozilla всё работает без проблем. Остаётся только повеситься. 🙁

14. GrihSa 21 ноября 2007 ∞

    Для тех, у кого этот метод не заработал:
    указывайте полный URL к файлу csshover.htc, начиная со слеша “/”

    Например,
    BODY {
    behavior:url(“/csshover.htc”);
    }
    После этого у меня hover сразу без вопросов заработал

15. Streamer 9 января 2008 ∞

    Метода работает, IE, зараза, подвисает правда, но хоть как-то. IE вообще во многом тормозит и лагает. Убить его мало.

16. Артур 27 февраля 2008 ∞

    пасип, полезная инфа, долго искал!

17. Матов Артемей 29 февраля 2008 ∞

    Не плохо, спасибо. Жаль, что на больших страницах тормозит.

18. SiriusLamp 30 апреля 2008 ∞

    Лечение IE6, без всякого .htc!!!! В стилях нужно написать следующее

    a :hover{ <br />
text-indent: 0; /*DO NOT REMOVE THIS OTHERWISE HOVER WILL NOT WORK IN IE6!*/<br />
}

    И уже потом ставить что-то типа

    a :hover span{ <br />
display: block;<br />
}

    Говорят можно поставить и любое другое свойство но вот это точно работает и не мешает – проверено!

19. ПаЛыЧ 21 июня 2008 ∞

    Хороший способ, но не хочется подгружать скрипты на сайте, посещаемость очень большая.
    Пробовал так
    div.dinav:hover > h2.tsnav, div.dinav:hover h2.tsnav {
    background:#51856B;
    color: #FFFFFF;
    }
    Работает только в опере 9.5 и сафари

20. AntonAntonov 16 сентября 2008 ∞

    Чё то не получается (((
    Вот так делаю:

    body {background-color:#353535;
    behavior:url(“csshover.htc”);}
    .pict img:hover {border:1px solid orange;}

    И, конечно, файл csshover.htc в той же директории, что и файл стилей.

21. Steven 31 октября 2008 ∞

    Вставляй не в CSS, а в страничку мужду Хедами (HEAD)
    У меня все четко работает!

    Спасибо.

22. M4D_5H4D0W 29 ноября 2008 ∞

    Надеюсь, народу пригодится.

    function ieHover(tag, cl)
    {
      if (document.all)
      {
         var d = document.getElementsByTagName(tag);
         for (i = 0; i < d.length; i++)
        {
        if (d[i].className == cl)
           {
          d[i].onmouseover = function(){this.className = cl + '_ie';}
          d[i].onmouseout = function() {this.className = cl;}
          }
        }
      }
    }

Следующая запись Синхронизация закладок в Mozilla Firefox

Предыдущая запись Несколько версий Internet Explorer одновременно