| |
|
|
| | Пытаюсь сделать простенькое горизонтальное меню на JS.
Таки сделал, порадовался, но не тут то было...
В кратце есть таблица c меню из 6 ячеек. Чтоб не распухал пост напишу одну из них, остальные аналогичные меняется только style="left: 263;"
<table>
<tr>
<td>
<!-------- Кнопка при mouseOver появляется соответствующий ей всплывающий блок -->
<a href="javascript://" <?if(!empty($PAGES[1])){?>onMouseOver="showMenu('1')"<?}?>>
<img src="/design/company_button.jpg" border="0">
</a>
<!-------- Всплывающий блок соответствующий этой кнопке ---------------->
<div id="sub1" class="submenu" style="left: 263;">
<?foreach($PAGES[1] as $id => $item){
echo "<a class='submenu' href='".$item['url']."'>".$item['name']."</a><br>";
}?>
</div>
</td>
<!--- ... -->
</tr>
</table>
|
СSS для всплывающего блока:
div.submenu{
position: absolute;
top: 165;
width:142;
border: 1 solid #E0E0E0;
padding:5;
display:none;
background-color: #F5F5F5;
text-align:left;
}
|
Всё отлично для фиксированного разрешения 1024х768. Абсолютно позиционирование вспывающего блока прям под кнопкой. Но если разрешение меняется соответственно и меняется style="left: 263;". Т.е. уже не 263 пиксела слева и блок съезжает от родительской кнопки.
И вот тут наступил полнейший ступор... Как быть в данной ситуации? Т.е. как сделать позиционирование меню не зависящее от разрешения экрана? | |
| |
|
|
| |
|
|
| |
для: axxil
(15.01.2007 в 23:42)
| | | попробуй с процентами вместо пикселей | |
| |
|
|
| |
|
|
| |
для: Padonak
(16.01.2007 в 08:26)
| | | В процентах тоже не получается. ибо 10% от 1280 = 128 а 10% от 1024 = 102 т.е. сдвиг полюбому будет в 26 пикселей (в данном случае).
А нельзя чтобы left в style в качестве контейнера брала не окно браузера, а какой-нить элемент, например div?
или как ещё? как вообще такие менюшки привязывают? Кто-нить делал?
В готовые скрипты лезть некогда, есть более приоритетные задачи... | |
| |
|
|
| |
|
|
| |
для: axxil
(15.01.2007 в 23:42)
| | | ложешь div с position: absolute; в див с position: relative; и позиционируешь абсолютный div относительно дива с position: relative;. а релятивный див, позиционируеться как и обычные элементы
<div style="position:relative;">
<div style="position:absolute; top 100px; left:200px"></div>
</div>
|
и позиционирование состоится относительно дива, а не боди | |
| |
|
|
| |
|
|
| |
для: Lelik
(16.01.2007 в 20:07)
| | | Lelik красавчик!!! Именно то что надо.
PS Скажу Лебедеву шоб премию тебе выписал ;-)))))) | |
| |
|
|
