Autor Zpráva
JarinCZ
Profil *
Zdravím,
snažím se neúspešně najít a vytvořit stránku, kde by bylo vertikální menu, které se mi vertikálně rozbalí (nejlépe odsazené jen pár znaků od základních menu položek) a dokud nekliknu na znovu na další jinou položku menu, tak mi poslední rozbalené podmenu zůstane rozbalené. Vše co jsem našel se rozbaluje horizontálně a hlavně po kliknutí se menu vrací do původní základní podoby, kdy žádné podmenu není trvale vidět. Už se kolem toho motám pár hodin a vše bez úspěchu. Existuje nějaká cesta bez komplikací?
Díky za rady či odkazy
peta
Profil
JarinCZ
vertikalni, horizontalni, co treba nejaky obrazek pro lidi, jako jsem ja, treba?
http://www.volny.cz/peter.mlich/www.htm#mssub21
site:diskuse.jakpsatweb.cz javascript menu

<html>
<head>

<style>
#nav a {color:#0088cc;}
#nav a.a_otevren,
#nav a.a_zavren {font-weight:bold; text-decoration:none;}
#nav a.a_otevren {color:#00bb00;}
#nav a.a_zavren {color:#ff0000;}
#nav ul.ul_otevren {}
#nav ul.ul_zavren {display:none;}
</style>

<script>
// hleda prime potomky, narozdil od getElementsByTagName
function objekt_deti(objekt,jmeno)
{
var i,j,pole,deti;
j = 0;
pole = [];
deti = objekt.childNodes;
if (deti && deti.length>0)
{
for (i=0;i<deti.length;i++)
{
el = deti[i];
if (el.nodeType==1 && el.tagName==jmeno)
{
pole[j] = el;
j++;
}
}
}
return pole;
}

function nav_zavri(obj_A,obj_UL,podminka)
{
var a,b;
if (obj_UL)
{
// zmen class pro A
a = 'a_otevren';
b = 'a_zavren';
obj_A.className = podminka ? b : a;
// zmen class pro UL
a = 'ul_otevren';
b = 'ul_zavren';
obj_UL.className = podminka ? b : a;
}
}

// akce pri onclick
function nav_akce(obj_A)
{
var a,b,i,o1,o2,o3, podminka;
podminka = obj_A.className=='a_otevren';
o1 = objekt_deti(obj_A.parentNode,'UL'); // z A do rodice, tj. LI a ziskat vsechny UL
if (o1.length>0)
{
// zavri vsechny vetve
o2 = objekt_deti(obj_A.parentNode.parentNode,'LI'); // z A do LI a do UL a ziskat vsechny LI uzly
for (i=0;i<o2.length;i++)
{
o3 = objekt_deti(o2[i],'UL');
if (o3.length>0)
{
// zmen class pro UL cislo 0
nav_zavri(objekt_deti(o2[i],'A')[0], o3[0], true);
}
}
// zmen class A i UL
nav_zavri(obj_A, o1[0], podminka);
return false;
}
return true;
}

function nav_pridej(o1)
{
var o2, i,j; // o1, o2 jsou pole objektu
if (o1.length>0)
{
for (i=0;i<o1.length;i++)
{
// nastav pro vsechny A class a onclick, ktere maji ve stejnem LI aspon 1 UL
o2 = objekt_deti(o1[i],'A');
for (j=0;j<o2.length;j++)
{
if (objekt_deti(o1[i],'UL').length>0)
{
o2[j].className = 'a_zavren';
o2[j].onclick = new Function ('return nav_akce(this)');
}
}
// nastav pro vsechny UL class a spus opakovani funkce pro dalsi prime potomky
o2 = objekt_deti(o1[i],'UL');
if (o2.length>0)
{
for (j=0;j<o2.length;j++)
{
o2[j].className = 'ul_zavren';
nav_pridej(objekt_deti(o2[j],'LI')); // opakuj sam sebe pro vsechy dalsi LI
}
}
}
}
}

function nav_vytvor(id)
{
nav_pridej(objekt_deti(objekt_deti(document.getElementById(id),'UL')[0 ],'LI'));
}
</script>
</head>

<body>
<div id="nav">
<ul>
<li><a href="#">nadpis</a>
<ul>
<li><a href="#">odkaz</a></li>
<li><a href="#">nadpis</a>
<ul>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
</ul>
</li>
<li><a href="#">nadpis</a>
<ul>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
</ul>
</li>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
</ul>
</li>
<li><a href="#">nadpis</a>
<ul>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
</ul>
</li>
<li><a href="#">nadpis</a>
<ul>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
<li><a href="#">odkaz</a></li>
</ul>
</li>
</ul>
</div>

<script>nav_vytvor('nav');</script>

</body>
</html>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

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