|
|
|
|
<style type="text/css" rel="stylesheet">
#test {display: inline-table}
#test * {font: bolder 15pt Arial; background: #AAAAAA}
#test a { background: none }
#test li{
position: relative;
top: 0px;
left: 0px; display: block;
}
#test li li:hover { background-color:red }
#test li:hover { background-color:red }
<!-- IE -->
#test a:hover { background:red }
</style>
<body>
<div class="t"><ul id="test">
<li><a href="#">[1 --------]</a>
<ul>
<li><a href="#">[1.1 --------]</a></li>
<li><a href="#">[1.2 --------]</a></li>
<li><a href="#">[1.3 --------]</a></li>
</ul>
</li>
<li>[2 --------]<div></div>
<ul>
<li><a href="#">[2.1 -------]</a></li>
<li><a href="#">[2.2 -------]</a></li>
<li><a href="#">[2.3 -------]</a></li>
<li><a href="#">[2.4 -------]</a></li>
</ul>
</li>
<li><a href="#">[3 --------]</a></li>
</ul></div>
...................
</body>
|
хочется сделать что-бы выглядело как такое в ФФ,
но в Опере изменение цвета фона не срабатывает так как хотелось-бы , и пропадают некоторые ссылки после наведения курсора мышки,
в ie-6 почти совсем не работает ,но это понятно, а с Оперой не очень
мне так кажется что я чего-то недопонимаю (совсем не читал о книги цсс),
подскажите как лучше сделать похожее , что-бы хоть в Опере, или script'ом в крайнем случае | |
|
|
|
|
|
|
|
для: xx77
(16.05.2008 в 13:07)
| |
<style type="text/css" rel="stylesheet">
#test {display: inline-table}
#test * {font: bolder 15pt Arial; background: #AAAAAA}
#test a { background: none }
#test li{
position: relative;
top: 0px;
left: 0px; display: block;
}
<!-- IE -->
</style>
<body>
<div class="t"><ul id="test">
<li><a href="#">[1 --------]</a>
<ul>
<li><a href="#">[1.1 --------]</a></li>
<li><a href="#">[1.2 --------]</a></li>
<li><a href="#">[1.3 --------]</a></li>
</ul>
</li>
<li>[2 --------]<div></div>
<ul>
<li><a href="#">[2.1 -------]</a></li>
<li><a href="#">[2.2 -------]</a></li>
<li><a href="#">[2.3 -------]</a></li>
<li><a href="#">[2.4 -------]</a></li>
</ul>
</li>
<li><a href="#">[3 --------]</a></li>
</ul></div>
<script type="text/javascript">
<!--
var elLi = document.getElementById('test').getElementsByTagName('li');
for(var i = 0; i < elLi.length; i++){
elLi[i].onmouseover = function(){this.style.background = 'red'};
elLi[i].onmouseout = function(){this.style.background = '#AAAAAA'};
}
-->
</script>
|
Попробуй так, у меня во всех браузерах заработало | |
|
|
|
|
|
|
|
для: jangot
(16.05.2008 в 14:28)
| | у меня в Opera/9.27 и Opera/9.27 всё такое-же мигание подсветки фона при наведении только на какойто маленький отрезок высоты элемента нижнего вложенного <li> , и совсем пропадание оставшегося отезка при переходе на следующий расположенный ниже
и вообще как-будто событие onmouseover происходит только при наведении на верхушки букв
нормально работает в Firefox/3.0b5 и SeaMonkey/1.1.9
с IE/6.0 похоже получается с javascript, хотя сначала у меня задумка сделать
такое динамическое меню , которое при выключенном javascript ,более-менее симпатично показывало-бы такое меню, и для эксплорера я уже и не надеюсь сделать так симпатично как хоть для Оперы.
Ещё сталкивался с тем что при динамическом изменении текста в Опере пропадают целые блочки текста , и появляются только после того как прокрутить страницу или какойнибудь ещё встряски или обновления.
Понять-бы в чём причина и как бороться , или в чём моя ошибка | |
|
|
|