+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Drop Down Menu, prośba o pomoc (/thread-drop-down-menu-pro%C5%9Bba-o-pomoc)
Drop Down Menu, prośba o pomoc - razekAB - 06-08-2012
RE: Drop Down Menu, prośba o pomoc - camelrafal - 06-08-2012
no rozwija się tak jak chcesz w czym problem?
najłatwiej to zrobić przy pomocy jquery -> hover
aby rozwinąć również jquery slideDown() oraz slideUp()
jedna linijka kodu
Kod:
$('#navi_top').hover(function(){$('.menu_list').slideDown();},function(){$('.menu_list').slideUp();});RE: Drop Down Menu, prośba o pomoc - razekAB - 07-08-2012
Problem w tym, że nie potrafię wypozycjonować menu które jest na pasku z linkami które pojawiają się po rozwinięciu, linki nie są równoległe co menu górnego.
RE: Drop Down Menu, prośba o pomoc - camelrafal - 07-08-2012
dla każdej kolumny osobno musisz ustawiać albo szerokosć albo prawy margines
bo każdą pozycje w głównym menu masz o innej szerokości
RE: Drop Down Menu, prośba o pomoc - raxiq - 13-08-2012
Ja korzystam z tej strony: http://cssmenumaker.com/
Tutaj masz w zasadzie wszystko czego potrzebujesz do stworzenia takiego menu.
Trochę zabawy z css i dasz radę nawet zrobić coś lepszego
No chyba, że chcesz bawić się z tym obecnym - to zdecydowanie tak jak camelrafal podpowiada.
RE: Drop Down Menu, prośba o pomoc - Kartofelek - 13-08-2012
Koledzy źle ci radzą.
1) menu robisz jako listę
2) menu robisz jako linki, a nie obrazki
3) żadne js. tutaj wystarczy zwykłe :hover
Kod:
<ul id="page-menu">
<li>
<a href="">......</a>
<ul class="submenu">
<li>pozycja w submenu</li>
<li>pozycja w submenu</li>
</ul>
</li>
<li>
<a href="">......</a>
<ul class="submenu">
<li>pozycja w submenu</li>
<li>pozycja w submenu</li>
</ul>
</li>
</ul>Kod:
ul {position:relative; height:30px;}
ul li {height:30px; display:inline-block; float:left; background:blue; font:bold 12px Arial, sans-serif; line-height:30px;}
ul li ul {display:none; position:absolute; top:30px; left:0; width:100%; height:150px; background:red;}
ul li:hover ul {display:block;}Pozycja submenu jest absolutna. Li menu nie mają relatywnego pozycjonowania, więc te submenu będzie się pozycjonować względem menu - czyli wszystkie submenu będą w tej samej pozycji (top:30, left:0). Reszta to odpowiednie stylowanie.