![]() |
|
||||||||||
|
|||||
|
Регистрация: Dec 2006
Сообщений: 3
|
Задача: сделать двухуровневое меню с полупрозрачными фонами.
В итоге: всё супер, но в IE6 не выделяются ссылки второго уровня меню, до тех пор пока они не опускаются ниже чем меню основное. ![]() Сайт с примером: http://delka.za.kharkov.ua/2levelspng24menu.html Для IE6 прописано такое правило: и для первого, основного меню - действительно всё работает. А вот со вторым - беда( Код меню: html <div id="menu" class="main">
<ul>
<li><a href="index.shtml">HOME</a></li>
<li class="sel"><a href="#">GALLERY</a>
<ul>
<li><a href="#">Cities</a></li>
<li><a href="#">Coastal</a></li>
<li><a href="#">Country</a></li>
<li><a href="#">Forests</a></li>
<li><a href="#">Mountains</a></li>
<li><a href="#">Outback</a></li>
<li><a href="#">Rivers & Lakes</a></li>
</ul>
</li>
... и так далее ...
</ul>
<div class="dftop"></div><div class="dfbottom"></div>
</div>
#menu ul {list-style-type: none}
#menu li {padding: 5px 0px 8px 0px; border-bottom: 1px #bfbfbf solid}
#menu li a {margin: 0px 0px 0px 20px}
#menu.main ul {border-top: 1px #bfbfbf solid}
#menu.main li {border-top: 1px #bfbfbf solid; margin: -1px 0px 0px 0px}
#menu.main li li {margin: -1px 10px 0px 10px}
#menu.main li:hover {background: url("../img/bg_lightmenu.png")}
#menu.main li a {color: #fff; display: block}
#menu.main li:hover a, #menu.main li.jshover a {font-weight: bold; color: #000}
#menu.main li:hover ul a, #menu.main li.jshover ul a {font-weight: normal}
#menu.main li:hover ul a:hover, #menu.main li.jshover ul a:hover {font-weight: bold}
#menu.main ul ul a {margin: 0px}
#menu.main li.sel:hover a, #menu.main li.sel.jshover a {background: url("../img/bull_href.png") no-repeat 190px 5px}
#menu.main ul ul {position: absolute; display: none; left: 222px; top: 0px; width: 110px; height: auto; margin: 0px; padding: 0px; border-top: none; z-index: 10}
#menu.main ul li:hover ul, #menu.main ul li.jshover ul {display: block}
и для IE6:
#content.main {height: 350px}
#menu.main div.dftop,#menu.main div.dfbottom {background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bg_darkmenu.png',sizingMethod='scale')}
#menu.main ul li {float: left; width: 222px; background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bg_midgreymenu.png',sizingMethod='scale')}
#menu.main li.jshover {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bg_lightmenu.png',sizingMethod='scale')}
#menu.main ul li li {float: left; width: 90px; filter: none; margin: -1px 5px 0px 5px}
#menu.main ul ul {background: none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/bg_lightmenu.png',sizingMethod='scale')}
#menu.main li a {position: relative}
Если я DXImageTransform.Microsoft.AlphaImageLoader уберу - всё очень даже замечательно работает. Всё что я видел пока про активность ссылок на слое с фильтром, это то что им нужно выставлять позицирование чтоб они с общего уровня поднялись вверх. Ну так оно стоит. Я даже специально отдельную ссылку абсолютным позицированием с большим z-index ставил по центру выпадающего меню - толку - ноль. Последний раз редактировалось Del'ka; 23.05.2007 в 22:38. |
|
|||||
|
Регистрация: Nov 2005
Сообщений: 75
|
А чем вам gif дорогу перебежал? Кстати в ИЕ7 ваша проблема не воспроизводится... Впрочем, он и без AlphaImageLoader прозрачность PNG поддерживает
|
|
|||||
|
Регистрация: Dec 2006
Сообщений: 3
|
Цитата:
|
|
|||||
|
.grin! wuz here
|
__________________
Breakcore them all! |
|
|||||
|
.grin! wuz here
|
кстати полупрозрачность лучше делать иначе, без пнг, так как в thickbox, т.е. с помощью.
opacity, -moz-opacity, expression...
__________________
Breakcore them all! |
|
|||||
|
Регистрация: Dec 2006
Сообщений: 3
|
Проблему решил отказавшись только для IE6 и младше от полупрозрачного фона и сделав всё меню второго уровня полупрозрачным.
|
![]() |
![]() |
Часовой пояс GMT +4, время: 13:29. |
|
|
« Предыдущая тема | Следующая тема » |
|
|