Helft einem kleinen Praktikanten!
Philip Brechler
- javascript
0 Gast0 Felix Riesterer0 molily
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
hallo ,
Ich bin grade dabei ein Menü für ein Haussteuerungssystem zu programmieren. Die Buttons sind fertig, der Javascript fast...
Event thread: load
Error:
name: ReferenceError
message: Statement on line 28: Reference to undefined variable: i
Backtrace:
Line 28 of inline#1 script in /testhaus.htm
if (! (s && i && i2))
Line 35 of inline#1 script in /testhaus.htm
coll(0);
Line 1 of script
coll_all();
At unknown location
[statement source code not available]
Fehler: i is not defined
Quelldatei: /testhaus.htm
Zeile: 47
[[if (!(s && i && i2)) return false;]]
mfg
Lieber Philip,
Was macht ein Besucher, wenn er Javascript nicht zur Verfügung hat? Google z.B. "kennt" kein Javascript und wird Deine Unterseiten nicht finden!
Mit welchem Browser hast Du Dein Script getestet?
Wie reagiert der Browser denn, wenn er sich _nicht_ Deiner Vorstellung nach verhält?
Wessen geistiges Eigentum verwendest Du hier mit diesem Script?
Warum nutzt Du solch veralteten Krams wie <center> und <body background=...>, wenn Du doch im <head> einen CSS-Bereich definiert hast?
Du weißt, dass <a href="javascript:..."> absolut zu vermeiden ist? (Siehe erste Frage)
Liebe Grüße aus Ellwangen,
Felix Riesterer.
Hallo,
Was macht ein Besucher, wenn er Javascript nicht zur Verfügung hat? Google z.B. "kennt" kein Javascript und wird Deine Unterseiten nicht finden!
Alle Links stehen für Suchmaschinen zugänglich im HTML-Code und werden lediglich durch CSS ein- und ausgeblendet.
Wessen geistiges Eigentum verwendest Du hier mit diesem Script?
*g* Das Script ist eher eine Fingerübung als ein Werk mit nennenswerter Schöpfungshöhe.
Du weißt, dass <a href="javascript:..."> absolut zu vermeiden ist? (Siehe erste Frage)
Naja, vielleicht sollte man das präzisieren. Wenn man eine Grafik mit einer JavaScript-Funktionalität versehen will, sollte man möglichst automatisch beim Laden der Seite entsprechende Event-Handler vergeben (»unobtrusive JavaScript«), anstatt sie direkt im HTML-Code als Attribute zu notieren. Dasselbe gilt für style="display:none", was ja nur sinnig ist, wenn JavaScript aktiviert ist (die coll_all() übernimmt das Einklappen beim Laden ja bereits).
Mathias