Philip Brechler: Helft einem kleinen Praktikanten!

Beitrag lesen

Hallo!

Ich bin grade dabei ein Menü für ein Haussteuerungssystem zu programmieren. Die Buttons sind fertig, der Javascript fast...
Die 2 Probleme:
Wie schaffe ich es bei unten stehenden Script, das sich nur ein Submenü öffnen lässt und nicht 2 gleichzeitig. Eigentlich dachte ich müsste das mit der Funktion coll() gehen, die beim klicken des Buttons aufgerufen wird und alle bis auf das zu öffnende schließt. Das klappt aber eben nicht.
Außerdem:
Wie schaffe ich es, dass die Submenüs sich zentriet unter den Hauptknöpfen anordnet?

Vielen Dank schon im Vorraus für euere Mühen.

Hier nun der Code:

<html>
<head>
<title>Menü</title>
<style type="text/css">
<!--
 body
 {
  font-family: "Arial";
  font-size: 1pt;
   background-color: #ffffff;
  color: #000000;
  text-align: lef;
 }
 ul.zzul {list-style-type:none; display: block;}
 span.zzspace {left:0px;}
 a, a:visited {color: #0000ff;}
 a:hover { color: #ff0000;}
-->
</style>
<script type="text/javascript">
<!--
function exp_coll(ind)

{
 s = document.getElementById("sp_" + ind);
 if (s.style.display == 'none')
 {
   s.style.display = 'block';
 }
 else if (s.style.display == 'block')
 {
   s.style.display = 'none';

}
}

function exp(ind)
{
 s = document.getElementById("sp_" + ind);
 if (!(s && i && i2)) return false;
 s.style.display = 'block';
}

function coll(ind)
{
 s = document.getElementById("sp_" + ind);
 if (!(s && i && i2)) return false;
 s.style.display = 'none';
}

function coll_all()
{

coll(0);
 coll(9);
 coll(33);
 coll(85);
 coll(87);
}

function exp_all()
{

exp(0);
 exp(9);
 exp(33);
 exp(85);
 exp(87);
}
-->
</script>
</head>

<body background=menu.gif onload="coll_all()">
<center>
<br>
<ul style="list-style-type:none; margin:0; padding:0;">

<li><a href="javascript:exp_coll(0);"><img src="Zimmer1.gif" border="0" id="im_0" /></a>
<ul class="zzul" id="sp_0" style="display:none;">
<li><span class="zzspace" /><a href="wohnen.html" target=main><img src="wohnen1.gif" border=0></a></li>

<li><span class="zzspace" /><a href="kuche.html" target=main><img src="kueche1.gif" border=0></a></li>

<li><span class="zzspace" /><a href="eltern.html" target=main><img src=eltern1.gif border=0></a></li>

<li><a href="kind1.html" target=main><img src=kind11.gif border=0></a></li>

<li><a href="kind2.html" target=main><img src=kind21.gif border=0></a></li>

</ul></li>

<li><a href="javascript:exp_coll(9);"><img src="Sicherheit1.gif" border="0" id="im_9" /></a>
<ul class="zzul" id="sp_9" style="display:none;">

<li><a href="ubersicht.html" target=main><img src="ubersicht1.gif" border=0></a></li>

<li><a href="meldungen.html" target=main><img src="meldungen1.gif" border=0></a></li>

<li><a href="turkamera.html" target=main><img src="turkamera1.gif" border=0></a></li>

</ul></li>

<li><a href="javascript:exp_coll(33);"><img src="klima1.gif" border="0" id="im_33" /></a>
<ul class="zzul" id="sp_33" style="display:none;">

<li><a href="heizung" target=main><img src="heizung1.gif" border=0></a></li>

<li><a href="warmwasser.html" target=main><img src="warmwasser1.gif" border=0></a></li>

<li><a href="ventilation.html" target=main><img src="ventilation1.gif" border=0></a></li>

</ul></li>

<li><a href="javascript:exp_coll(85);"><img src="kommunikation1.gif" border="0" id="im_85" /></a>
<ul class="zzul" id="sp_85" style="display:none;">

<li><a href="email.html" target=main><img src="email1.gif" border=0></a></li>

<li><a href="telefon.html" target=main><img src="telefon1.gif" border=0></a></li>

<li><a href="fax.html" target=main><img src="fax1.gif" border=0></a></li>

</ul></li>

<li><a href="javascript:exp_coll(87);"><img src="system1.gif" border="0" id="im_87" /></a>
<ul class="zzul" id="sp_87" style="display:none;">

<li><a href="einstellungen.html" target=main><img src="einstellungen1.gif" border=0></a></li>

<li><a href="hilfe.html" target=main><img src="hilfe1.gif" border=0></a></li>

</ul></li>

</body>
</html>

MfG

Philip Brechler