Autor Zpráva
Analytik
Profil *
Zdravím,
mám rozbalovací menu, když najedu na položku rozbalí se menu dolů a já pak klikem něco vyberu.
Jenom že, když´vypíšu pod menu text, tak po najeti na položku se menu sice rozbalí, ale je průhledné, tak že se tluče vypsaný text s položkami menu, ale co je horší, když jedu myší dolů po rozbaleném menu, tak před prvním vypsaným řádkem rozbalené menu zmizí, tak že nemohu provést výběr položky v rozbalovacím menu.
Žádnou průhlednost, ani jinou záludnost jsem nenastavoval.

Netušíte vˇčem může být zádrhel ?

Nechci žádnou průhlednost, chci aby po najetí na položku menu, se rozbalilo dolů a pokud tam bude něco vypsáno, tak aby to překrylo a funkčnost se nezměnila.

Díky.
lionel messi
Profil
Analytik:
Žádnou průhlednost, ani jinou záludnost jsem nenastavoval.
>
Netušíte vˇčem může být zádrhel ?
Prosím o odkaz na živú ukážku, nech vieme poradiť lepšie.
jefitto44
Profil
Myslím, že zádrhely môžu byť v z-indexoch. Tie však fungujú len tam, kde je position nastavená na iné ako static (default)
Analytik
Profil *
lionel messi:
<!DOCTYPE HTML>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <style>
  
  #menu1 a {    
color:#ffffff;  
font-weight:bolder; 
text-decoration:none; 
text-transform:uppercase; 
font-family:Arial, Helvetica, sans-serif; 
}
#menu1 ul li ul {
display:none;
}
#menu1 ul li {
float:left;
list-style:none;
width:150px;
height:30px;
background:#02517F;
text-align:center;
padding-top:12px;
border-right:2px solid white;
}
#menu1 ul li:hover {
background: #466A7F;
text-align:center;
}
#menu1 ul ul {
margin-top:10px;
}

#menu1 ul li ul li {
margin-left:-40px;
}


#menu1 ul li:hover > ul {display:block;}
#menu1 ul li ul li {background: #49BBFF;}
#menu1 ul li ul li:hover {background: #466A7F;}

  
  </style>
  </head>
  <body>
  
  <div id="menu1">

<ul>
<li> <a href="#">Odkaz 1</a> </li>

<li> <a href="#">Odkaz 2</a>
<ul>
<li> <a href="#">Pododkaz 1</a> </li>
<li> <a href="#">Pododkaz 2</a> </li>
<li> <a href="#">Pododkaz 3</a> </li>
</ul>
</li>

<li> <a href="#">Odkaz 3</a> </li>
<li> <a href="#">Odkaz 4</a> </li>
<li> <a href="#">Odkaz 5</a> </li>
</ul>

</div>

  </body>
</html>



lionel messi:
Tady jsem dal samozřejmě místo živých odkazů zavináč.
Tomáš123
Profil
Analytik:
tak po najeti na položku se menu sice rozbalí, ale je průhledné, tak že se tluče vypsaný text s položkami menu
Na vnorené <ul> musíš použiť absolútnu pozíciu (ktorá okrem iného zamedzí aj „priehľadnosti“).

tak že nemohu provést výběr položky v rozbalovacím menu.
Po skopírovaní tvojho kódu nič také nepozorujem...
Analytik
Profil *
Tomáš123:

vypozicování jsem si myslel, že jsem udělal tímto :

#menu1 ul li {
float:left;
list-style:none;
width:200px;
height:30px;
background:#02517F;
text-align:center;
padding-top:12px;
border-right:2px solid white;
}

#menu1 ul ul {
margin-top:10px;
}

#menu1 ul li ul li {
margin-left:-40px;
}

moc nerozumím, co mám ještě udělat.
jefitto44
Profil
#menu1 ul ul {
margin-top:10px;
position:absolute;
}
Analytik
Profil *
jefitto44:
tak tady jsem to zkusil s tím absolute a provedl jsem dva výstupy tisk 1 a tisk 2
Průhlednost nezmizela a navíc se to rozbalovací menu přeskládalo, že se rozbaluje vodorovně.
Když najedu na odkaz dva a pak jedu myší dolů, jakmile dojedu k Tisk 1 , tak to rozbalovací menu zmizí.
Kompletní ukázka i s vypsáním pod menu.

<!DOCTYPE HTML>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <style>
  
  #menu1 a {    
color:#ffffff;  
font-weight:bolder; 
text-decoration:none; 
text-transform:uppercase; 
font-family:Arial, Helvetica, sans-serif; 
}
#menu1 ul li ul {
display:none;
}
#menu1 ul li {
float:left;
list-style:none;
width:150px;
height:30px;
background:#02517F;
text-align:center;
padding-top:12px;
border-right:2px solid white;
}
#menu1 ul li:hover {
background: #466A7F;
text-align:center;
}
#menu1 ul ul {
margin-top:10px;
position:absolute; 
}

#menu1 ul li ul li {
margin-left:-40px;
}


#menu1 ul li:hover > ul {display:block;}
#menu1 ul li ul li {background: #49BBFF;}
#menu1 ul li ul li:hover {background: #466A7F;}

  
  </style>
  </head>
  <body>
  
  <div id="menu1">

<ul>
<li> <a href="#">Odkaz 1</a> </li>

<li> <a href="#">Odkaz 2</a>
<ul>
<li> <a href="#">Pododkaz 1</a> </li>
<li> <a href="#">Pododkaz 2</a> </li>
<li> <a href="#">Pododkaz 3</a> </li>
</ul>
</li>

<li> <a href="#">Odkaz 3</a> </li>
<li> <a href="#">Odkaz 4</a> </li>
<li> <a href="#">Odkaz 5</a> </li>
</ul>

</div>
<span style="position: absolute; left: 198px; top: 65px; width: 150px; text-align: center;">  
tisk 1
</span> 
<span style="position: absolute; left: 198px; top: 85px; width: 150px; text-align: center;">  
tisk 2
</span> 

  </body>
</html>
Tomáš123
Profil
Analytik:
přeskládalo, že se rozbaluje vodorovně
To je iba následkom tvojho nečistého kódu. Spôsobuje to riadok 20 (float: left). Použi namiesto neho display: inline/inline-block (alebo pripíš ku vysúvaciemu li float: none, obtekanie je na tomto mieste ale zbytočné (takisto ako aj symbol „>“ na riadku 43), takže radšej ten display). Riadky 23 a 26 sa dajú prepísať ako line-height: 42px; (hodnota pravdepodobne nezodpovedá presne), čím nebude potrebný riadok 34. Selektor na riadku 44 je možné skrátiť na #menu li li. Obdobne tak i na riadku pod ním. Riadky 38 - 40 by nemuseli existovať, ak by si deklaroval nulový margin (zvykne sa nulovať aj padding) pre ul.

vypozicování jsem si myslel, že jsem udělal tímto
To je niečo iné. Hovoril som o position: absolute.

Submenu ti mizne a vyzerá priehľadne kvôli absolútne poziciovanému textu (ktorý vôbec nie je potrebné poziciovať).

Skús to trochu prerobiť, snáď som nezabudol na žiadny vážnejší nedostatok, ktorý by ti mohol brániť v ceste k dokončeniu.

Keď skončíš, pozri si ukážku.
Analytik
Profil *
Tomáš123:

díky, za rady
zkusil jsem si s tím pohrát, ale text prosvítá a mizí menu mě i v ukázce.
Ten text je pozicovanej z různých vstupů formátovanej. To tak misí zůstat.
Zkoušel jsem i prioritu překrývání objektů, ale výsledek stejný .... Prosvítá a mizí.


Tomáš123:

tak zpět, tím překrýváním objektů se mi podařilo odstranit tu průhlednost a tím pádem už menu nemizí u první vypsané položky pod menu.

tak ještě jednou dík za rady

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: