Autor Zpráva
Cody
Profil
Ahoj,
potřebuju vyřešit jeden problém a bohužel moc nevím jak na to. myslím, že tohle bez užití Java Scriptu nepůjde. Jde o toto, na webu který jsem dělal mám CSS menu pomocí vnořených ul, li. Možno vidět zde: http://www.svatebni-saty-studiobrigit.cz/

Menu je dělaný takhle:

<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=aktuality" title="Aktuality">Aktuality</a></span><br /><div class="divider">&nbsp;</div></li>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=svatebni-saty-2" title="Svatební šaty">Svatební šaty</a></span><br /><div class="divider">&nbsp;</div>
<ul>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=kolekce-2009" title="Kolekce 2009">Kolekce 2009</a></span><br /><div class="divider">&nbsp;</div></li>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=zakladni-kolekce" title="Základní kolekce">Základní kolekce</a></span><br /><div class="divider">&nbsp;</div></li>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=romanticke-svatebni-saty" title="Romantické svatební šaty ">Romantické svatební šaty </a></span><br /><div class="divider">&nbsp;</div></li>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=barevne-svatebni-saty" title="Barevné svatební šaty">Barevné svatební šaty</a></span><br /><div class="divider">&nbsp;</div></li>
<li><span><a href="http://www.svatebni-saty-studiobrigit.cz/index.php?brigit=extravagantni-svatebni-saty" title="Extravagantní svatební šaty ">Extravagantní svatební šaty </a></span><br /><div class="divider">&nbsp;</div></li>
</ul>
</li>


Já v podstatě potřebuju, aby se po kliknutí na nadřazenou sekci objevila/rozbalila podsekce. Teď je to tak, že je vše viditelné:

Dokážete mi někdo pomoct prosím? Třeba jen nasměrovat? Podotýkám že v Java Scriptu téměř neumím, takže by se mi líbilo nějaké řešení typu vzít-upravi-použít, bez složitějších úprav v Java Scriptu. Děkuju Moc!
habendorf
Profil
1) Ten kód je naprosto příšernej - span, div a br jsou tam navíc. Ale ok, o tom teď není řeč.
2) Jednoduše dáš li ul {display:none} a na onclick to změníš. V praxi se to dělá s ohledem na přístupnost ještě trochu jinak, ale to můžeme řešit, až ti bude fungovat základ.
Cody
Profil
Ahoj, díky za odpověď, našel jsem pár řešení jak to pomocí JS na onclick změnit, ale moc to nevyhovuje mé situaci, buď bych všem podřazeným ul, li musel dát nějaký IDéčko http://diskuse.jakpsatweb.cz/index.php?action=vthread&forum=8&topic=83455 a nebo nebo nějakou třídu onclick="document.all.ukazFotogalerie.style.display='block'"

Já se omlouvám, přes Java Script jsme fakt lama, můžeš mi poradit jak ten zápis udělat? Pro tuto situaci aniž bych musel podřazeným sekcím dávat nějaké id nebo class?
habendorf
Profil
Aha, takže najdeš všechny li první úrovně a navěsíš na ně obsluhu události onclick (klíčové slovo addEventListener).
Dále najdeš všechny ul (bude tam jen jeden) v daném li (klíčové slovo document.getElementsByTagName, případně přes DOM (childNodes, nodeType, nodeValue)).
Pak už jen stačí těmto ul přidávat a odebírat třídu (className), která se postará o zviditelnění / schování.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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