| Autor | Zpráva | ||
|---|---|---|---|
| Sennin Profil |
#1 · Zasláno: 11. 1. 2016, 23:56:47
Zdravím....
mám zobrazenie a skrývanie div-u pomocou css po rade od Keeehi konkrétne tu No a aby toho nebylo málo, tak existují postupy, jak udělat to skrývání a odkrývání po kliknutí jen čistě s CSS. Všetko je funkčné teda ak testujem kód takto: Html <a id="show" class="toogler-link" href="#">
Zobraz
</a>
<a id="hide" class="toogler-link" href="#">
Skry
</a>.navigation {display: none;}
#show:focus, #hide {display: none;}
#show:focus + #hide {display: block;}
#show:focus ~ .navigation {display: block;width: 100%;}
#hide:focus ~ .navigation {display: none;}
@media print {#show, #hide {display: none;}}
.navigation {
position: absolute;
top: 0;
left: 0;
max-width: 280px;
height: auto;
min-height: 100%;
background-color: #d9534f;
opacity: .9;
z-index: 1001;
}Html <div class="hide-this">
<div class="col-sm-12 col-xs-12">
<div class="toogler">
<a href="#" class="toogler-link" id="show">
Zobraziť
</a>
<a href="#" class="toogler-link" id="hide">
Skry
</a>
</div>
</div>
</div>
<div class="navigation">
<div class="row">
<div class="col-md-12">
</div>
</div>
</div>.navigation {display: none;}
#show:focus, #hide {display: none;}
#show:focus + #hide {display: block;}
#show:focus ~ .navigation {display: block;width: 100%;}
#hide:focus ~ .navigation {display: none;}
@media print {#show, #hide {display: none;}}
.navigation {
position: absolute;
top: 0;
left: 0;
max-width: 280px;
height: auto;
min-height: 100%;
background-color: #d9534f;
opacity: .9;
z-index: 1001;
}Moja otázka teda znie: Prečo sakra ak to obalím to nefičí? som s toho už na nervy.... Ak ste už riešili podobný problém alebo viete kde sa to riešilo bude za všetko Vďačný |
||
| Keeehi Profil |
#2 · Zasláno: 12. 1. 2016, 03:43:22
Je to jednoduché, ty jsi selektorem zacílil ten odkaz. Elementy, které můžeš ovlivnit bude on sám a jeho potomci. Ne však jeho rodiče, takže tomu obalu CSS nezměníš.
|
||
| jefitto44 Profil |
#3 · Zasláno: 12. 1. 2016, 09:35:35
Daj selektor, ktorý bude vyberať obal, nie odkaz samotný...
|
||
| Tomáš123 Profil |
Sennin:
S takouto HTML štruktúrou nejde prvok .navigation zamerať (s ohľadom na udalosť na prvku) z #hide resp. #show. Nadradený prvok nejde použiť, lebo udalosť :focus nefunguje na každom prvku. Bez pseudoNerozumiem, prečo bolo nutné meniť štruktúru, keď prvok, ktorý zobrazuješ je aj tak absolútne poziciovaný na to isté miesto. Alebo to iba v tejto ukážke? Ak áno, a štruktúra sa už ďalej nebude prispôsobovať, môžeš ešte skúsiť počarovať s <labelom> (teraz nemám čas skúšať, či by to mohlo fungovať). Ak nebude použiteľné ani toto, budeš musieť späť k JavaSricptu.
Navrhoval by som ti pokračovať v starom vlákne. Človek sa musí zbytočne preklikávať a riešiš vlastne to isté. |
||
|
Časová prodleva: 8 let
|
|||
0