Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [CSS]Rozwijalne menu 2-poziomowe z 1-poziomowego
axwell
post
Post #1





Grupa: Zarejestrowani
Postów: 143
Pomógł: 1
Dołączył: 14.11.2007

Ostrzeżenie: (10%)
X----


Mam kod 1 poziomowego, rozwijalnego menu w CSS:

  1. #menu li {list-style: none;}
  2. #menu {height: 30px;}
  3. #menu ul {visibility: hidden; position: absolute; top: 100%; left: 0;}
  4. #menu li {position: relative;}
  5. #menu ul li { background:none;}
  6. #menu li li {float: none; padding-top: 1px; width: 160px;}
  7. #menu li:hover ul {visibility: visible;}
  8. #menu a, #menu li:hover li a {display: block; text-decoration: none; padding: 0 10px;}
  9. #menu li li a {width: 220px;}
  10. #menu li:hover a, #menu li:hover li:hover a {background-color: #06F;}


a tak to wygląda w HTML:
  1. <ul id="menu">
  2. <li><a href="#">Strona glówna</a></li>
  3. <li><a href="#">Korepetycje</a></li>
  4. <ul>
  5. <li><a href="#">Korepetycje grupowe</a></li>
  6. <li><a href="#">Korepetycje indywidualne</a></li>
  7. </ul>
  8. </li>
  9. </ul>


Chdziałbym dodać jeszcze jeden poziom do tego menu, czyli:
  1. <ul id="menu">
  2. <li><a href="#">Strona glówna</a></li>
  3. <li><a href="#">Korepetycje</a></li>
  4. <ul>
  5. <li><a href="#">Korepetycje grupowe</a></li>
  6. <ul>
  7. <li><a href="#">Dodatkowy poziom 1</a></li>
  8. </ul>
  9. <li><a href="#">Korepetycje indywidualne</a></li>
  10. </ul>
  11. </li>
  12. </ul>


Co powinienem dodać w CSS?

Ten post edytował axwell 19.03.2013, 10:09:31
Go to the top of the page
+Quote Post
Sebastian003
post
Post #2





Grupa: Zarejestrowani
Postów: 282
Pomógł: 2
Dołączył: 22.03.2007

Ostrzeżenie: (0%)
-----


błąd masz co to za </li> pod koniec ?

http://jsfiddle.net/JrLaA/3/

css
Kod
#menu li ul li ul li{}


Ten post edytował Sebastian003 19.03.2013, 10:59:44
Go to the top of the page
+Quote Post
!*!
post
Post #3





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


@up Tylko że to nie podlega walidacji. UL(dziecko) powinien być w LI(rodzic).

edycja:
http://jsfiddle.net/cVqEH/

Ten post edytował !*! 19.03.2013, 11:08:42
Go to the top of the page
+Quote Post
axwell
post
Post #4





Grupa: Zarejestrowani
Postów: 143
Pomógł: 1
Dołączył: 14.11.2007

Ostrzeżenie: (10%)
X----


Cytat(!*! @ 19.03.2013, 11:02:44 ) *
@up Tylko że to nie podlega walidacji. UL(dziecko) powinien być w LI(rodzic).

edycja:
http://jsfiddle.net/cVqEH/


Próbowałem ale niestety nie mogę zmodyfikować tego, aby menu rozwijało się po najechaniu myszką.
Go to the top of the page
+Quote Post
!*!
post
Post #5





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


http://jsfiddle.net/cVqEH/10/
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 24.08.2025 - 17:44