| Autor | Zpráva | ||
|---|---|---|---|
| David1256 Profil |
Dobrý den,
mám takovouto strukturu menu. <ul id="nav">
<li><a href="?stranka=a"></a></li>
<ul>
<li><a href="?stranka=aa"><span style="color:#a05122">■</span> aa</a></li>
<li><a href="?stranka=ab"><span style="color:#a05122">■</span> ab</a></li>
</ul>
</li>
</ul>a takovéto css k menu #nav li:hover ul, #nav li.sfhover ul {
left: 0;
}
#nav li ul {
position: absolute;
top:91px;
padding-top:20px;
padding-bottom:20px;
left: -999em;
}
#nav li:hover ul {
left: 20px;
}
#nav, #nav ul {
position:relative;
padding: 0;
margin: 0;
list-style: none;
}
#nav a {
display: block;
}
#nav li {
float: left;
}Nyní to funguje tak, že se při přejetí myši nad menu 1. úrovně zobrazí submenu (aa, ab), ale nějak mi nejde vymyslet, jak to udělat, aby když jsem třeba na stránce a, aa nebo ab se submenu také zobrazovalo. Nyní se zobrazuje jen při přejití myši, ale já bych potřeboval, aby se také zobrazovalo, když jsem na odkazu ze stejného submenu nebo na nadřazeném odkazu tomu submenu. Nevíte někdo, jak na to? Nejlépe aby to fungovalo bez JS. Děkuji. |
||
| jenikkozak Profil |
#2 · Zasláno: 14. 4. 2013, 17:13:22
To je stejný princip, na kterém funguje běžné zvýraznění právě zobrazené stránky v menu. Na serveru zjistíš, která stránka je otevřená, a příslušné položce v menu přidáš třídu, kterou nastyluješ stejně, jako je nyní pseudotřída hover.
Pokud se stránka negeneruje dynamicky, je nutné třídu do konkrétního HTML souboru připsat ručně. |
||
| David1256 Profil |
Toto mě už taky napadlo. Ale v reálu to fungovalo tak, že se sice už zobrazovalo za daných podmínek menu 2. úrovně, ale jakmile jsem přejel myší nad nějakým jiným odkazem z menu 1. řádu, tak se to původní menu 2. úrovně dle otevřené stránky začne překrývat odkazy z toho menu 2. úrovně myší přejížděného.
Nevím, jak udělat to, aby se při přejetí myši, změnila třída všech ostatních submenu než toho přejížděného na tu s left:-999em |
||
| jenikkozak Profil |
Pomocí pseudotřídy :hover na menu pak můžeš vlastnosti té třídy přebít.
|
||
| margin Profil * |
#5 · Zasláno: 14. 4. 2013, 19:20:22
Nevím, zda to bude vadit, ale v HTML kódu vidím klasickou chybu, špatně zanořené seznamy, ale s pokusem o opravu. Koncová značka
</li> na řádku 3 nemá co dělat, položka končí tagem </li> na řádku 12.
|
||
| David1256 Profil |
#6 · Zasláno: 14. 4. 2013, 19:28:17 · Upravil/a: David1256
margin:
Díky. Já to tak nemám na webu. Jen jsem to trochu upravoval pro vložení sem a koukám, že se mi tam vloudila chybka. jenikkozak: Nevím moc, jak to myslíš. Ale pokud je už left:20px na jednom submenu pro aktuální adresu, tak nevím, jak mám ho mám po přejíždění myší nad jiným odkazem v menu vrátit zpět na left:-999em, aby bylo zase vidět jen to submenu přejížděného prvku. Zatím to umím udělat jen tak, že aktuální submenu má už nastaveno left:20px a to přejížděné myší má také left:20px, ale nevím, jak mam tomu aktuálnímu při přejíždění nad jiným odkazem vrátit zpátky left:-999em Jestli to myslíš tak, že tímto přebiju hover u <li>, tak sice odstraním při přejíždění to aktuální submenu, ale zase se mi nikdy nepodaří při přejíždění nad li tedy li:hover dát zpět left:20px, protože ho bude paradoxně přebíjet to #nav:hover #nav:hover li ul {
left: -999em; }Třeba tě nějak špatně chápu, ale stále nevím, jak to udělat... |
||
|
Časová prodleva: 11 let
|
|||
0