Autor Zpráva
Kazda
Profil *
Ahoj, mám na stránkách svislé rozbalovací menu a v hlavním sloupci je flash. A ta flash překrývá to menu když se rozbalí do 2. a 3. úrovně. Nevíte jestli je nějak možné, aby to menu bylo nad flashí? Zkoušel jsem vše, ale myslím, že to snad ani možné není. I na stránkách Youtube je problém, že jim horní vodorovné menu po rozbalení zajede pod player. Ale zase na stránkách Streamu jsem se díval, že to jde, ale nevím jak tam to mají udělané.

Díky
Zdeněk Košťál
Profil
Kazda
Flashi předáš parametr wmode nastaven na transparent, díky němu může obsah stránky flash překrývat.
GOLLUMek
Profil *
ahojda, mám problém s překrýváním flashe. Respektive překrývá mi rozbalovací horizontální menu. Zkoušela jsem změnit parametr wmode na transparent, z-index... ani jedno z toho nefunguje neustále se mi rozbaluje menu pod flash... co s tim mohu udělat v html max css ? (edituju v joomle, bez editoru tedy jen čistý kod...)
dok.leo
Profil *
tešeni je poměrně jednoduche, nastavte
z-index:1;
pro každy uroven rozb.
<ul>


kus kodu pro inspiracii

#menu ul ul ul {z-index:1;position:absolute;display:none;border:1px solid #FFFFFF;}
Bubák
Profil
dok.leo:
tešeni je poměrně jednoduche
Byl jsem natěšený, ale jsem poděšený, tvůj návod i kód je ééé, asi nevíš, jak finguje z-index u vnořené pozice.
dok.leo
Profil *
Sorry mam poslat odkaz na fungujici stranku? A co se tyče kodu tak to je jen pro inspiracii. Mam vložit cele řešeni aby jsi nebyl tak poděšený?



 <div id="menu">
    <ul class="level11">
      <li><a href="">A</a></li>
      <li><a href="">B</a>
         <ul class="level2">
               <li><a href="" class="border">1</a></li>
               <li><a href="" class="border">2</a>
                       <ul class="level3">
                              <li><a href="" class="border">a</a></li>
                              <li><a href="" class="border">b</a></li>
                              <li><a href="" class="border">c</a></li>
                       </ul>
                   </li>
              <li><a href="" class="border">3</a>
                      <ul class="level3">
                             <li><a href="" class="border">a</a></li>
                             <li><a href="" class="border">b</a></li>
                             <li><a href="" class="border">c</a></li>
                      </ul>
                   </li>
              <li><a href="" class="border">4</a>
                      <ul class="level3">
                             <li><a href="" class="border">a</a></li>
                             <li><a href="" class="border">b</a></li>
                             <li><a href="" class="border">c</a></li>
                       </ul>
                    </li>
               <li><a href="" class="border">5</a></li>
                    </ul>
                       </li>
                            <li><a href="">C</a>
        <ul class="level2">
<li><a href="" class="border">1</a></li>
<li><a href="" class="border">2</a>
    <ul class="level3">
<li><a href="" class="border">a</a></li>
<li><a href="" class="border">b</a></li>
<li><a href="" class="border">c</a></li>

</ul>
</li>
<li><a href="" class="border">3</a></li>
 <li><a href="" class="border">4</a>
     <ul class="level3">
<li><a href="" class="border">a</a></li>
<li><a href="" class="border">b</a></li>
<li><a href="" class="border">c</a></li>

  </ul>
   </li>
<li><a href="" class="border">5</a>
  <ul class="level3">
<li><a href="" class="border">a</a></li>
<li><a href="" class="border">b</a></li>
<li><a href="" class="border">c</a></li>
  </ul>
 </li>
<li><a href="" class="border">6</a></li>
   <li><a href="" class="border">7</a></li>
   <li><a href="" class="border">8</a>
        <ul class="level3">
<li><a href="" class="border">a</a></li>
<li><a href="" class="border">b</a></li>
<li><a href="" class="border">c</a></li>
</ul>
</li>
   <li><a href="" class="border">9</a></li>
        </ul>
      </li>
<li><a href="">D</a></li>
<li><a href="">E</a></li>
<li><a href="">F</a></li>
<li class="last"><a href="">G</a>
        <ul class="level2">
<li><a href="">1</a></li>
<li><a href="" class="border">2</a></li>
<li><a href="">3</a></li>
        </ul>
      </li>
    </ul>
  </div>
  <div id="flash">
    <object type="application/x-shockwave-flash" data="/web/cs/_swf/flhome.swf" width="959" height="360">		  
  		<param name="movie" value="/web/cs/_swf/flhome.swf" />
  		<param name="wmode" value="transparent" />
  		<img src="/web/cs/_images/flhome.jpg" width="959" height="360" alt="flash" />		  
		</object>
  </div>





CSS




/* NAVIGACNI MENU */

#menu {width:959px;position:relative;margin-bottom:1px;}
#menu ul {position:relative;list-style-type:none;padding:0px;margin:0px;}
#menu li {float:left;width:119px;margin-right:1px;position:relative;behavior:url('../hovermenu.htc');}
#menu li.last {margin-right:0px;}
#menu li a {display:block;width:119px;height:28px;padding-top:12px;overflow:hidden;color:#fff;text-decoration:none;background:url(../_images/bgMenuItemLevel1.gif) no-repeat;text-align:center;font-size:1.2em;font-family:Tahoma;font-weight:bold;}
#menu li a:hover {background-position:0px -40px;}

#menu ul ul {z-index:1;position:absolute;left:-1px;top:40px;display:none;width:150px;border:1px solid #FFFFFF;}
#menu ul ul ul {z-index:1;position:absolute;left:150px;top:0px;display:none;width:150px;border:1px solid #FFFFFF;}
/*odkazy rozbaleného podmenu */
#menu ul ul li {clear:both;width:150px;background:#333333;font-size:0.85em;}
#menu ul ul li a {display:block;width:130px;background:none;padding:10px 0px;margin:0px 10px;height:auto;text-align:left;font-weight:normal;color:#999999;}
#menu ul ul li a.border {border-bottom:1px dotted #666666;}
#menu ul li.active ul li a {color:#FFFFFF;}
/*odkazy rozbaleného podmenu:hover */
#menu ul ul li a:hover{color:#FFFFFF;}
#menu ul.level1 li:hover ul.level2 {display:block;}
/*odkazy rozbaleného podmenu */
#menu ul ul ul li {clear:both;width:150px;background:#3b3b3b;font-size:0.85em;}
#menu ul ul ul li a {display:block;width:130px;background:none;padding:10px 0px;margin:0px 10px;height:auto;text-align:left;font-weight:normal;color:#999999;}
#menu ul ul ul li a.border {border-bottom:1px dotted #666666;}
#menu ul ul li.active ul li a {color:#FFFFFF;}
/*odkazy rozbaleného podmenu:hover */
#menu ul ul ul li a:hover{color:#FFFFFF;}
#menu ul.level1 ul.level2 li:hover ul.level3 {display:block;}

/* FLASH / UVODNI OBRAZEK */

#flash {background:#CCCCCC;padding-bottom:10px;clear:both;}





Otestuj to klidně maš to i zarovnaný vuče sobě a pykně dlouhe takže to určo prekryje ten flash
A dobudoucna ne hodnot člověka po kusu kodu, nebo se nudiš? Vem si nejakou dobrou knihu do ruky, pomuže a prospěje


ne testuj v IE6 :-) nemaš .htc
Davex
Profil
dok.leo:
Domníváš se, že to po roce Kazdovi pomůže, když mu pravděpodobně pomohla už odpověď [#2]?

Tvůj kód v předchozím příspěvku je zjevně chybný a nefunkční, takže se zamítá.
Bubák
Profil
dok.leo:
Sorry mam poslat odkaz na fungujici stranku?
Ano, protože tenhle celkem více než sto řádkový kód je rozbitý a menu se vůbec nehodlá rozbalovat v žádném prohlížeči.

ne testuj v IE6 :-) nemaš .htc
hover.htc mám a umím používat, ale nemám IE6.
dok.leo
Profil *
Bubák:
„[i]sto řádkový kód je rozbipro tento krat maš pravdu, je rozbity ale jenom jsem tam dopustil par chyb v html kodu což neměni nic na tom že css funguje. Hned na začatku oprav tohle
<ul class="level11">
za tohle
<ul class="level1">
,stanese když to pišeš na rychlo a pak projed kod na ukončeni
</ul> </li>
zvladne to i lajk. Když to nedokažeš tak už prosim tě nepiš nesmysly.
Čus
panther
Profil
dok.leo:
zvladne to i lajk. Když to nedokažeš tak už prosim tě nepiš nesmysly.
nenazýval bych zrovna Bubáka laikem :-)

Když jsme u toho prefesionalismu, proč máš u drtivé většiny položek class="border", proč máš zbytečný div#menu, proč máš zbytečné třídy u všech <ul>?
dok.leo
Profil *
Davex:
Domníváš se, že to po roce Kazdovi pomůže
jemu ne ale je to hotovi kod pro toho kdo to ještě neumi a hlavně ani netuši jak na to. Vim co řikam podobný navody schraněl sam kdysi.

panther:
proč máš
jo těd už by to nenapsal, je to 2 roky stare řešeni

nenazýval bych zrovna Bubáka laikem
ja jsem to ani neudělal, psal jsem

zvladne to i lajk
nechodim jsem uražet lidi a nebo pochybovat v jejich schopnosti a vědomosti, jsem tady jen pro to aby se neučit něco noveho, připadně poradit jinym v ramkach možnosti
Bubák
Profil
dok.leo:
A teď si představ, že jsem tvou základní myšlenku z tvého kódu, z-indexy vymazal, a ono to funguje, jako by se nechumelilo.
Druhý pokus, pro #object {z-index:101; position: relative;} pro #menu {z-index: 100;} dopadl podle očekávání, flash je nad menu
Třetí pokus, pro #object {z-index:100; position: relative;} pro #menu {z-index: 101;} dopadl podle očekávání, menu je nad flashem, o položky menu se nestarám, tak totiž funguje z-index.

panther:
Když jsme u toho prefesionalismu, proč máš...
Jsou lidé, kteří mají přemnožené třídy. A jsou lidé, kteří využívají kontext.

nenazýval bych zrovna Bubáka laikem
Nejsem profesionál. Ale jak praví staré webylónské přísloví, "Kozel se nemusí stát zahradníkem, aby poznal shnilou úrodu".

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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

0