|
|
|
|
|
для: sl1p
(14.01.2009 в 05:46)
| | Что-то не то... в данном варианте кнопка всегда слева, меню вываливается из-под нее, но при этом сдвигает остальные объекты вправо. Если в кнопке обойтись без float, а в меню поставить float:right, уже лучше, но меню по-любому лепится к границам экрана. В IE к тому же начинает гулять нижняя граница body.
Вообще, можно как-нибудь с помощью JS получить расстояние в пикселах от границы окна до обьекта? Это было бы самое то | |
|
|
|
|
|
|
|
для: amigo63
(13.01.2009 в 21:07)
| |
<style type="text/css">
.pannel{
text-align:center;
width:300px;
font-size: 16px;
background: #e8e8f8;
border: 2px ridge #009;
display: none;
position: relative;
z-index:99;
top:27px;
float:left;
}
.pannelLink{
border:1px solid #000;
background:#fff;
color:#000;
padding:3px;
text-decoration:none;
float:left;
}
</style>
<div>
<a href="#" onClick="return displayMenu(this)" class="pannelLink">Open/Close</a>
<div class="pannel">
txttxttxttxttxttxttxttxttxttxttxttx t<br>
txttxttxttxttxttxttxttxttxttxttxttx t<br>
txttxttxttxttxttxttxttxttxttxttxttx t<br>
txttxttxttxttxttxttxttxttxttxttxttx t<br>
</div>
</div>
<script type="text/javascript">
function displayMenu(obj) {
obj = obj.parentNode.getElementsByTagName("DIV")[0];
with(obj.style) {
display = !display || display == 'none' ? 'block' : 'none';
}
return false;
}
</script>
|
| |
|
|
|
|
|
|
| Есть список ссылок:
<div class="pannel" id="pannel" onclick="displaymenu()">
<span><img src="../graphic/newpage.gif">Создание страницы</span>
<a href="?act=editpages"><img src="../graphic/editpages_active.gif">Редактирование страниц</a>
<a href="?act=config"><img src="../graphic/config_active.gif">Настройки</a>
<a href="?act=dump"><img src="../graphic/dump_active.gif">Дамп БД</a>
<a href="?act=parts"><img src="../graphic/parts_active.gif">Разделы</a>
<a href="?act=exit"><img src="../graphic/logout_active.gif">Выход</a>
</div>
|
стиль этого списка выглядит вот так:
.pannel{
width:300px;
font-size: 16px;
display: none;
position: absolute;
top:30px;
left: 300px;
background: #e8e8f8;
border: 2px ridge #009;
}
|
при нажатии на кнопку вызывается функция:
function displaymenu(){
if(document.getElementById("pannel").style.display=="none"||document.getElementById("pannel").style.display==""){
document.getElementById("pannel").style.display="inline";
}else{
document.getElementById("pannel").style.display="none";
}
}
|
То есть, как видите, все очень примитивно. Но...
Не могу понять, как сделать, чтобы меню выпадало внизу и справа от кнопки (поверх страницы!), независимо от того, в каком месте страницы она находится? Экспериментировал с position и float, желаемых результатов не принесло... Заранее спасибо за помощь! | |
|
|
|
|