| Autor | Zpráva | ||
|---|---|---|---|
| Pavlii Profil * |
#1 · Zasláno: 7. 2. 2011, 19:01:33
Ahojte, mám problém s hromadným zobrazením skrytých DIVů a myslím, že řešení bude asi jednodušší než si myslím. Používám JS pro rozevírání jednotlivých DIVů, konkrétně:
function zobrazSkryj(idecko)
{
el=document.getElementById(idecko).style;
el.display=(el.display == 'block')?'none':'block';
}
V CSS mám .appendix {display: none; height: 120px; background: #EEEEEE}
Skrývaných položek je na stránce více, každé má své IDčko a jednotlivě je mohu skrývat a odkrývat. Jenže jak udělat hromadné odkrývání a skrývání přes jeden odkaz? Potřeboval bych nějak měnit hodnotu v CSS z "none" na "block"... Poraďte prosím |
||
| Kcko Profil |
#2 · Zasláno: 7. 2. 2011, 20:12:15
Tak když to vezmeme co nejprimitivněji tak
<a href="#" onclick="zobrazSkryj('id1'); zobrazSkryj('id2'); zobrazSkryj('idn');">zobraz / skryj</a>Já osobně bych to napsal trošku jinak ... -> jQuery |
||
| Pavlii Profil * |
#3 · Zasláno: 8. 2. 2011, 13:22:02
Kcko:
Dík, avšak skrývaných položek se na stránce zobrazuje více jak 320... raději bych nějak měnil přímo ten styl... |
||
| Chamurappi Profil |
#4 · Zasláno: 8. 2. 2011, 13:39:05
Reaguji na Pavliiho:
Změň třídu společného rodiče a zbytek práce nech na CSS. Hodil by se konkrétnější popis problému — tohle hromadné přepnutí má být nezávislé na přepínání obhospodařovaném uvedeným skriptem? |
||
| Pavlii Profil * |
#5 · Zasláno: 8. 2. 2011, 17:16:09
Chamurappi:
Uvedený skript má odkrývat pouze jednotlivé DIVy a proto bych pro hromadné odkrytí všech DIVů použil jiný script. V JS jsem dost slabý a tak mě nenapadá jak to myslíš... Pomohl by mi kousek scriptu. Díky! |
||
| Chamurappi Profil |
#6 · Zasláno: 8. 2. 2011, 17:24:35
Reaguji na Pavliiho:
<style>
.schovej-potomky .potomek { display: none; }
</style>
<script>
function zobrazSkryj(idecko)
{
var el = document.getElementById(idecko)
if(el.className != "schovej-potomky")
el.className = "schovej-potomky";
else
el.className = "";
}
</script>
<div id="rodic">
<div class="potomek">Tohle se skryje.</div>
<div>Tohle se neskryje.</div>
<div class="potomek">Tohle zase jo.</div>
<button onclick="zobrazSkryj('rodic'); return false">Přepnout zobrazení</button>
</div> |
||
| Pavlii Profil * |
#7 · Zasláno: 8. 2. 2011, 18:23:05
To je ono!!! Díky moc!
|
||
| Pavlii Profil * |
#8 · Zasláno: 9. 2. 2011, 17:29:11
Včera jsem jásal dost předčasně. Osvětlím celou záležitost:
CSS: .appendix {display: none; height: 120px; background: #EEEEEE}<script LANGUAGE="JavaScript">
function zobrazSkryj(idecko)
{
el=document.getElementById(idecko).style;
el.display=(el.display == 'block')?'none':'block';
}
function ukaz()
{
le=document.getElementByName('app').style;
le.display=(le.display == 'block')?'none':'block';
}
</script>
<a href="#" onclick="ukaz()">Zobraz/skryj vše</a>
<p>Nadpis 1 <a href="#" onclick=" zobrazSkryj(1)">podrobnosti</a></p>
<div id="1" name="app" class="appendix">Skrývaný obsah</div>
<p>Nadpis 2 <a href="#" onclick=" zobrazSkryj(2)">podrobnosti</a></p>
<div id="2" name="app" class="appendix">Skrývaný obsah</div>
<p>Nadpis 3 <a href="#" onclick=" zobrazSkryj(3)">podrobnosti</a></p>
<div id="3" name="app" class="appendix">Skrývaný obsah</div>
|
||
|
Časová prodleva: 13 let
|
|||
0