Drop down menu CSS

0ggi · Napísal **0ggi**: 03.12.2009 21:55

Zdravím.
Robím drop down menu, všetko je v poriadku, ale posledné 2 časti v CSS sa mi nejako bijú a nechcú spolupracovať. Prikladám kód:

Kód:

style type="text/css"> 
#menu { 
   width: 960px; 
   background: #FCFF00; 
   float: left; 
   list-style: none; 
} 
#menu ul { 
   list-style: none; 
   margin: 0; 
   padding: 0; 
   width: 133px; 
   float: left; 
    
    
} 
#menu h2, #menu a { 
   display: block; 
   border-width: 2px; 
   border-style: outset; 
   border-color: white; 
   margin: 0; 
   padding: 1px; 
} 

#menu h2 { 
   color: red; 
   background: #E6E600; 
   font-size: 20px; 
   text-align: center; 
} 
    
#menu a { 
   color: black; 
   background: #E6E600; 
   text-decoration: none; 
   text-align: center; 
} 

#menu a:hover { 
   color: black; 
background: #FCFF00; 
} 

#menu ul ul { 
   position: absolute; 
   z-index: 500; 
} 

div#menu ul ul, 
div#menu ul li:hover ul ul 

{display: none;} 

div#menu ul li:hover ul, 
div#menu ul ul li:hover ul 
{display: block;} 
</style> 
</head> 
<body> 
<!-- start menu HTML --> 
<div id="menu"> 
<ul> 
   <li><h2><a href="Novinky.html">Novinky</a></h2> 
      </li> 
</ul> 

<ul> 
<li><h2><a href="O_nas.html">O nás </a></h2> 
      </li> 
<ul> 
   <li><a href="Kto_sme_a_co_robime.hmtl">Kto sme a čo robíme</a> 
      </li> 
   <li><a href="struktura_spolocnosti.html">Štruktúra spoločnosti</a> 
      </li> 
   <li><a href="Podnikova_filantropia.html">Podniková filantropia</a> 
      </li> 
   <li><a href="Nase_uspechy.html.">Naše úspechy</a> 
      </li> 
</ul> 
</ul> 

<ul> 
   <li><h2><a href="Oddelenia.html">Oddelenia</a></h2> 
      </li> 
<ul> 
   <li><a href="Oddelenie_marketingu.html">Marketing</a> 
      </li> 
   <li><a href="Oddelenie_ludskych zdrojov.html">Ľudské zdroje</a> 
      </li> 
   <li><a href="oddelenie_financii.html">Financie</a> 
      </li> 
   <li><a href="Oddelenie_vyroby.html">Výroba</a> 
      </li> 
</ul> 
</ul> 

<ul> 
   <li><h2><a href="Fotogaleria.html">Fotogaléria</a></h2> 
   </li> 
<ul> 
   <li><a href="DOD.html">DOD</a> 
      </li> 
   <li><a href="UVZ.html">UVZ</a> 
      </li> 
   <li><a href="Vyrobky.html">Výrobky</a> 
      </li> 
   <li><a href="Vianoce_na_hrade.html">Vianoce na hrade</a> 
      </li> 
</ul> 
</ul> 

<ul> 
   <li><h2><a href="APE.html">APE</a></h2> 
      </li> 
<ul> 
   <li><a href="co_je_to_ape.html">Čo je to APE?</a> 
      </li> 
   <li><a href="Junior_achievement.html">Junior Achievement</a> 
      </li> 
   <li><a href="Vyhody_studentov_ape.html">Výhody študentov APE</a> 
      </li> 
</ul> 
</ul> 

<ul> 
   <li><h2><a href="Na_stiahnutie.html">Na stiahnutie</a></h2> 
      </li> 
</ul> 

<ul> 
   <li><h2><a href="Kontakt.html">Kontakt</a></h2> 
      </li> 
</ul> 
    
    
    
    
    
    
</div>

Ide presne o časť:

Kód:

div#menu ul ul, 
div#menu ul li:hover ul ul 

{display: none;} 

div#menu ul li:hover ul, 
div#menu ul ul li:hover ul 
{display: block;}

Robil som to podľa návodu a nie a nie to rozbehať
Vždy, keď prepíšem v prvom na block, tak mi všetko zobrazí, ale ostane tam... Chcem docieliť to, aby sa menu rozbalilo a ostalo rozbalené, keď na ňom bude kurzor...

0ggi · Napísal autor témy **0ggi**: 04.12.2009 18:35

Sry za spam, ale potreboval by som to rozbehnúť čo najskôr... Už sa s tým trápim niekoľko dní a nie a nie to dať do poriadku

Flety · Napísal **Flety**: 04.12.2009 18:53

Nemáš to na nete? Nech sa na to pozrieme naživo.

0ggi · Napísal autor témy **0ggi**: 04.12.2009 19:23

No konkrétne toto ešte nie, zatiaľ to robím len localhost, ale ak by bolo potrebné, môžem ten súbor upnúť

// Tak tu to je:

Kód:

http://kingss.wbl.sk/menu_skuska.htm

Tominator · Napísal **Tominator**: 04.12.2009 21:04

urob to trošku inteligentnejšie:
priraď im class alebo id

0ggi · Napísal autor témy **0ggi**: 04.12.2009 21:11

Tominator píše:

urob to trošku inteligentnejšie:
priraď im class alebo id

K čomu konkrétne?

shaggy · Napísal **shaggy**: 04.12.2009 23:22

Oggi - nevynucuj si odpoveď. To, že sa ospravedlníš neznamená, že ti to prepáčime. Spam a posthunting tu nemá nikto rád, ak chceš rýchlu odpoveď, zaplať si človeka, čo ti poradí. A nemusíš reagovať ani na tento môj príspevok, je tu len pre tvoju informáciu, nie je to diskusia (takže odpovede len k téme).

Tominator · Napísal **Tominator**: 05.12.2009 9:19

začni tu:

Kód:

div#menu ul

camo · Napísal **camo**: 07.12.2009 19:08

No a povedz nám ešte v akom prehliadači si to zobrazuješ.
*.htc tam máš?
No a keď robíš niečo tak pofidérne ako hover menu a si začiatočník, tak kód zbytočne nekomplikuj H2 nadpismi a pod., ale najprv to vyskúšaj na jednoduchšej konštrukcii.

stenley · Napísal **stenley**: 07.12.2009 20:00

vysvetli mi, preco pre kazdu rodicovsku polozku pouzivas zvlast zoznam (navyse to mas este aj zle vnorene)? sprav cele to menu ako vnoreny zoznam:

Kód:

<ul>
   <li>Polozka 1
      <ul>
         <li>Polozka 1.1</li>
         <li>Polozka 1.2</li>
      </ul></li>
   <li>Polozka 2
      <ul>
         <li>Polozka 2.1</li>
      </ul></li>
   <li>Polozka 3</li>
</ul>

Potom mozes zacat riesit drop-down menu...

petanorech · Napísal **petanorech**: 16.12.2009 18:46

Robil som CSS Dropdown menu podľa tohoto návodu:

http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery

- je to pekne krokované aj s jednotlivými ukážkami, skús si to svoje prejsť ešte raz podľa tohoto.

- potom je tam rozšírenie o jQuery, ale to už je ako bonus

Drop down menu CSS

Podobné témy