Autor | Zpráva | ||
---|---|---|---|
Neas Profil |
#1 · Zasláno: 1. 2. 2011, 16:23:32 · Upravil/a: Neas
Ahoj.
Vytvořil jsem si třídu, která se má zobrazit při přejíždění po odkazech. Vše funguje, ale vadí mi odřádkování, které se pod odkazem objeví při přejíždění. Živá ukázka prol lepší pochopení: http://neas.rpg2heaven.cz/ třída "popisek" je zatím aplikována pouze na první odkaz, pro testovací účely má tento popisek nastaveno bílé pozadí. CSS: .popisek { display:none; } menu li:hover .popisek { display:block; width:220px; position:relative; left:-220px; /* šířka menu */ background-color:white; } Budu vděčný za rady, jak odstranit ono vzniklé odřádkování. Děkuji |
||
Kry5 Profil |
#2 · Zasláno: 1. 2. 2011, 16:25:26
když posuneš element pomocí relativního pozicování tak stále zabírá místo na své původní pozici.
|
||
Neas Profil |
#3 · Zasláno: 1. 2. 2011, 16:34:08
a je možnost, jak se toho zbavit?
|
||
panther Profil |
#4 · Zasláno: 1. 2. 2011, 16:39:41
Neas:
nastav položce menu position: relative , popisku absolutní pozici se záporným left .
Tahle celá konstrukce ti nebude fungovat ve starších IE, neznají :hover na LI.
|
||
Kry5 Profil |
#5 · Zasláno: 1. 2. 2011, 16:41:16
Zkus vlastnost float a nebo absolutní pozicování vzhledem k menu, ale to je zbytečný.
|
||
Kry5 Profil |
#6 · Zasláno: 1. 2. 2011, 16:44:49
panther:
Na to existuje JS hack, ale teď si nevzpomínám jak se jmenuje. Nevim, jestli by to tim floatem nějak šlo, ale kdyžtak tohle je taky řešení, ale pro každou položku musí bejt ta pozice jiná pokud se má zobrazovat vedle ní. |
||
Neas Profil |
#7 · Zasláno: 1. 2. 2011, 17:00:15 · Upravil/a: Neas
panther:
nastavil jsem u menu li position: relative a u menu li:hover .popisek position:absolute se záporným left, popisek se umístil ze shora absolutně vzhledem k položce v menu (do teď správně), ale z leva absolutně vzhledem celému dokumentu. Kry5: float neudělal žádnou změnu. |
||
Kry5 Profil |
#8 · Zasláno: 1. 2. 2011, 17:07:15
Neas:
Příklad: <div id="rodic" style="position: relative;"> <div id="potomek" style="position: absolute;"> </div> </div> Pokud teď začneš pozicovat potomek tak jako výchozí bod bude levej horní roh rodice. |
||
Neas Profil |
#9 · Zasláno: 1. 2. 2011, 17:24:55 · Upravil/a: Neas
omylem jsem napsal realative místo relative, teď už to funguje, děkuju oběma za pomoc.
|
||
margin Profil * |
#10 · Zasláno: 1. 2. 2011, 17:27:25
A proč to neuděláš normálně?
<style> #menu a span {visibility: hidden;} #menu a:hover span {visibility: visible;} </style> <div id="menu"> <menu> <li> <a href="" title="">Odkaz <span>ahoj</span></a> </li> <li><a href="" title="">Odkaz</a></li> <li><a href="" title="">Odkaz</a></li> <li><a href="" title="">Odkaz</a></li> </menu> </div> Hoveru na odkazu můžeš vzletně říkat "optimalizace pro IE6". V ukázce je základní princip, jde naformátovat podle potřeby. <div id="menu"> má nějaký hlubší smysl, nebo jsi ho použil z rozmaru, aby <menu> v něčem bylo? |
||
Neas Profil |
#11 · Zasláno: 1. 2. 2011, 19:17:16
margin:
A proč to neuděláš normálně?: jednoduše -> nenapadlo mě to. Ale zdá se to jako lepší řešení, takže děkuju <div id="menu"> má nějaký hlubší smysl: hodlám tam ještě něco dodat, web zdaleka ještěnení ve finální podobě, jak jde vidět z ukázky. |
||
Časová prodleva: 13 let
|
0