2010-05-04 1 views
3

есть ли способ использовать атрибут «hover» для всех элементов html вместо «только» в IE?проблема с hover с элементами не ссылок в IE

например, "li: hover". он не работает в IE6. (я не знаю о других версиях IE).

Отредактировано: Я просто хочу сделать это с помощью CSS без javascript. Это простое меню.

+0

': hover' корректно работает в IE8. – josh3736

+0

спасибо, но у многих пользователей еще есть IE6. –

ответ

3

Я не думаю, в любом случае вы можете сделать это без javascript в IE 6.

Если это одноуровневое меню, вы можете настроить стиль, чтобы сделать визуализацию ссылок как отображение: заблокировать внутри ли, чтобы вы могли выполнять зависания на них, и при необходимости устанавливать промежутки внутри ссылок для дополнительной гибкости стилизации, но лично никогда не испытывал большой удачи, пытаясь распространить это на многоуровневые меню.

Стратегия изящного деградации может быть вашим лучшим выбором.

+0

ОК, наконец, я использую некоторые фрагмент кода Javascript код из http://www.xs4all.nl/~peterned/csshover.html как csshover HTC файл для изменения поведения тела для IE. кажется жизнь без Javascript невозможно! –

4

Нет, IE6 неправильно реализовал псевдо-класс hover для всех элементов. Он поддерживает его только для якорей.

2

Использование onmouseover/onmouseout с javascript.

Когда вы наводите указатель на элемент, вы просто показываете скрытый div с содержимым вашего наведения.

Когда вы выберете элемент, вы скроете div с вами, наведите содержимое.

Jquery делает это проще, если вы не хотите, чтобы сделать всю работу ног на

<span id="hoverSpan" class="hoverelement" hoverdata="this is my hoverdata">HoverSpan</span> 
<a href="#" id="hoverAnchor class="hoverelement" hoverdata="this is my hover data">HoverAnchor</a> 
<div id="hoverdiv" style="display:none"></div> 

<script language="javascript"> 
    $(document).ready(function() { 
    $(".hoverelement").each(function() { 
     var myelement = $(this); 
     myelement.mouseover(function (e) { 
     var myhovertext = myelement.attr("hoverdata"); 
     $("#hoverdiv").html(myhovertext).show(); 
     }); 
     myelement.mouseout(function (e) { 
     $("#hoverdiv").html(myhovertext).hide(); 
     }); 
    }); 
    }); 
</script> 

Сво поздно, и я не проверял, но идея есть. В общем, вы бы сделать парение для любого элемента с классом «hoverelement»

+0

спасибо за ваш комментарий, но я не хочу использовать javascript. просто с CSS. –

+0

Я не верю, что это возможно с помощью Just css. Есть слишком много проблем с различными браузерами/версиями и Стили Hover –

0

пытаются jquery ... я не знаю точно, но он может работать в IE6 ....

Смежные вопросы