Дочерние селекторы в IE 6
245 повідомлень
#16 років тому
Всем привет!Делаю CSS меню. Не могу заставить работать дочерние селекторы в IE6. Конструкция следующая:
для нормальных браузеров:
#menulist_root-ext li:hover > ul{
display: block;
}
для IE <= 6:
#menulist_root-ext li.hover > ul{
display: block;
}
530 повідомлень
#16 років тому
ИЕ 6 поддерживает hover только для a, тебе нужен Ява скрипт.Этот мне дали использовал для выпадающего меню (на ul и li)
<script type="text/javascript">
jsHover = function() {
var hEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0, len=hEls.length; i<len; i++) {
hEls.onmouseover=function() { this.className+=" jshover"; }
hEls.onmouseout=function() { this.className=this.className.replace(" jshover", ""); }
}
}
if (window.attachEvent && navigator.userAgent.indexOf("Opera")==-1) window.attachEvent("onload", jsHover);
</script>
245 повідомлень
#16 років тому
Дело не в hover. Я же говорю, в чем проблема. hover - это класс специальный (смотрите внимательнее)
245 повідомлень
#16 років тому
Необходимо именно достучаться до дочернего элемента (в данном случае ul)
791 повідомлення
#16 років тому
Можно яваскрипт меню подключить, только для ie6вариантов то мало
245 повідомлень
#16 років тому
Неужели никак нельзя для IE6 хак какой-нить???
2195 повідомлень
#16 років тому
Вариантов как раз много)Я бы исходил из того, что дочерние селекторы для решения подобных задач как бы и не нужны вообще, но раз уж автору очень хочется, два популярных решения:
#menulist_root-ext li.hover ul {display:block}
#menulist_root-ext li.hover * ul {display:inline}
В Conditional Comments для IE6, разумеется
Или так: посилання
245 повідомлень
#16 років тому
Цитата ("Sir_Michael"):Вариантов как раз много)
Я бы исходил из того, что дочерние селекторы для решения подобных задач как бы и не нужны вообщеl
А как бы Вы сделали? Мне необходимо, чтобы при наведении курсора на элемент списка li, показывался список, вложенный в li и следующий сразу за li.
245 повідомлень
#16 років тому
Вы гдееее? ))))
245 повідомлень
2195 повідомлень
#16 років тому
Цитата:чтобы при наведении курсора на элемент списка li, показывался список, вложенный в li и следующий сразу за li.
У вас в li несколько вложенных списков одного уровня? А зачем? И почему нельзя первому задать отдельный класс.
Или вы имеете в виду, что в внутри вложенного ul может быть еще вложенный ul - тогда дочерние селекторы не нужны, нужно прописать условия вложенности.
Не изобретаете ли вы что-то подобное: посилання / посилання
245 повідомлень
#16 років тому
В <li> может быть только один список <ul>.
245 повідомлень
#16 років тому
Вот такая конструкция:
<ul id="menulist_root-ext" class="mainlevel-ext" >
<li> pp
<ul id="menulist_1-ext" class="firstlevel-ext" >
<li> pp11 </li>
</ul>
</li>
<li> pp2
<ul id="menulist_2-ext" class="firstlevel-ext" >
<li>pp21</li>
</ul>
</li>
<li> pp3
<ul id="menulist_3-ext" class="firstlevel-ext" >
<li>pp31
<ul id="menulist_3_1-ext" >
<li>pp311
</li>
</ul>
</li>
</ul>
</li>
</ul>
111 повідомлень
#16 років тому
Sir_Michael прав...Сначала задаем стили элементов верхнего списка (уровня 1+)
li { }
а ПОСЛЕ задаем стили элементов вложенных списков уровня 2+
li li { }
потом можно описать элементы списков уровня 3+ и т. д.
Таким образом каждое новое правило перекрывает предыдущие.
245 повідомлень
#16 років тому
Цитата ("Rondmeo"):Sir_Michael прав...
Сначала задаем стили элементов верхнего списка (уровня 1+)
li { }
а ПОСЛЕ задаем стили элементов вложенных списков уровня 2+
li li { }
потом можно описать элементы списков уровня 3+ и т. д.
Таким образом каждое новое правило перекрывает предыдущие.
Вы точно поняли, о чем речь? С помощью Вашего метода будут раскрываться все li определенного уровня - мне это не нужно. Я поэтому и использую там дочерний селектор. Нужно, чтобы отображался именно <ul>, входящий в конкретный <li>.
245 повідомлень
#16 років тому
Никто не знает?
245 повідомлень
#16 років тому
Народ, всем спасибо! Разобрался! Rondmeo и Sir_Michael респект Вам!
245 повідомлень
#16 років тому
Пардон, забыл. Вот оно. (для наглядности правила по отдельности написал). Дочерние селекторы не использовал.#menulist_root-ext li:hover ul{
display: block;
}
#menulist_root-ext li:hover ul ul{
display: none;
}
#menulist_root-ext li:hover ul li:hover ul{
display: block;
}
/*for ie <= 6 fix-------------------------------*/
#menulist_root-ext li.hover ul{
display: block;
}
#menulist_root-ext li.hover ul ul{
display: none;
}
#menulist_root-ext li.hover ul li.hover ul{
display: block;
}
/*-------------------------------------------*/