| Autor |
Nachricht |
accessoire
Threadersteller
Dabei seit: 05.02.2007
Ort: -
Alter: 34
Geschlecht: 
|
Verfasst Mo 26.05.2008 13:17
Titel JS-Anfänger versucht Code zu verstehen |
  |
|
Ich muss im Moment notgedrungen damit anfangen Javascrpt zu lernen, da ich eine Webseite programmieren soll, die (meines Wissens nach) leider nur in Javascript umsetzbar ist. Mein Problem ist dabei das Dropdown-Menü, welches ich möglichst barrierearm gestalten will (ja, ich weiß, dass Javascript an sich schon eine Barriere ist). Barrierearm heißt, dass es sowohl mit onmouseover, als auch onfocus funktionieren soll. Aber bevor ich da groß was abändern kann an meinem im Internet gefundenen Script muss ich erstmal richtig in JS einsteigen. Ich bin wie gesagt Anfänger und hab mich erst reingelesen in die Grundlagen und bin immo bei selfHTML bei der Objektreferenz.
http://www.2fz-clan.de/4website/index.html Hier ist das Menü zu sehen. Menüpunkte in LIs gepackt. Damit jetzt aber onfocus funktioniert, benötigt man ein a-Tag jeweils um die einzelnen Menüpunkte.
Und genau das muss ich programieren. Das Menü soll auch ausfahren, wenn man das a-Tag fokussiert. Beim jetzigen Stand kann man nur durch onmouseover über ein Listenelement das Menü ausfahren.
Genug gequatscht. Hier der JS-Code und meine Kommentare dazu inwieweit ich es (nicht) verstehe. Ich möchte keine Komplettlösung, sonder nur eine Korrektur meiner Interpretation des Skripts.
| Code: | clickMenu = function(menu) {
var getEls = document.getElementById(menu).getElementsByTagName("LI");
//* Variable getEls spricht alle LIs und die ID "menu" an? Oder besteht aus diesen? *//
var getAgn = getEls;
//* Variable getAgn hat den gleichen Wert wie getEls?
for (var i=0; i<getEls.length; i++) {
//* i bekommt den Wert 0. i wird permanent um 1 erhöht. Wenn i kleiner als die Anzahl der HTML-Tags - die via getEls angesprochen werden - ist, wird folgende Anweisung durchgeführt?
getEls[i].onmouseover=function() {
//* Wenn eines der getEls angesprochenen Elemente mit der Maus überfahren wird, startet die Funktion?
for (var x=0; x<getAgn.length; x++) {
/** x bekommt den Wert 0. x wird permanent um 1 erhöht. Wenn x kleiner als die Anzahl der HTML-Tags - die via getAgn angesprochen werden - ist, wird folgende Anweisung durchgeführt?
getAgn[x].className=getAgn[x].className.replace("click", "");
/** Der Variable getAgn - also allen angesprochenen Elementen (da getAgn = getEls ist(?)) - wird ein Klassenname zugewiesen ... den Teil verstehe ich nicht so wirklich ... wieso folgt dann nochmal ein = usw ... ich weiß nur, dass der letzte Teil wohl die Klasse "click" durch nichts bzw. "" ersetzt? Also keine Klasse mehr zugewiesen ist?
}
this.className+=" click";
}
}
}
/** Bahnhof :[ |
Danke schonmal  .
|
|
| |
  |
 |
phihochzwei
Moderator
Dabei seit: 08.06.2006
Ort: Mülheim an der Ruhr
Alter: 46
Geschlecht:
|
Verfasst Mo 26.05.2008 14:05
Titel Re: JS-Anfänger versucht Code zu verstehen |
|
|
| accessoire hat geschrieben: |
| Code: |
/**
* Method clickMenu
* @param menu Bekommt irgendwas übergeben, dessen Wert dann mit dem namen "menu" abgerufen werden kann. Ich glaube ein String :)
clickMenu = function(menu) {
var getEls = document.getElementById(menu).getElementsByTagName("LI");
//* Variable getEls liefert alle Elemente vom Typ "LI" die im Element mit der ID, die du als menu-parameter übergeben bekommen hast, vorhanden sind *//
var getAgn = getEls;
//* Variable getAgn hat den gleichen Wert wie getEls? ja :)
for (var i=0; i<getEls.length; i++) {
//* i bekommt den Wert 0. i wird permanent um 1 erhöht. Sollange i kleiner als die Anzahl der Elemente im Array getEls ist, wird der Code ausgeführt
getEls[i].onmouseover=function() {
//* Wenn eines der getEls angesprochenen Elemente mit der Maus überfahren wird, startet die Funktion? Jou
for (var x=0; x<getAgn.length; x++) {
/** x bekommt den Wert 0. x wird permanent um 1 erhöht. Auch hier, Solange x kleiner als getAgn´s Anzahl der Elemente ist wird der Code ausgeführt.
getAgn[x].className=getAgn[x].className.replace("click", "");
/** Der Variable(ich würde sagen das das ein Object ist) getAgn wird eine Variable "className" zugeordnet.
}
this.className+=" click";
}
}
}
/** Bahnhof :[ |
Danke schonmal . |
Soweit ich das verstehe....
|
|
| |
 |
|
|
Anzeige
|
|
|
accessoire
Threadersteller
Dabei seit: 05.02.2007
Ort: -
Alter: 34
Geschlecht:
|
Verfasst Mo 26.05.2008 16:21
Titel
|
|
|
Danke dir erstmal ! Ich grübel und grübel aber ich komm nicht dahinter. Wann genau werden denn i bzw. x um 1 erhöht? Sowas wird doch immer erhöht, wenn z. B. eine Funktion neu startet, oder? Hmm ... scheiße ich glaub ich muss mir die ganzen Grundlagen noch einmal durchlesen  .
|
|
| |
|
|
Spurlos
Dabei seit: 29.10.2005
Ort: -
Alter: 41
Geschlecht:
|
Verfasst Mo 26.05.2008 16:29
Titel
|
|
|
das passiert hier:
| Code: |
for (var x=0; x<getAgn.length; x++)
|
var x=0
variable x wir auf 0 gesetzt und dann steht da weiter
x<getAgn.length
also wenn x kleiner als die länge von getAng (ein array)
x++
x so lange erhöhen bis der selbe wert wie die länge des arrays (getAgn) erreicht
|
|
| |
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mo 26.05.2008 17:56
Titel
|
|
|
Ich verstehe nicht wo du hier die Barriere denkst zu beseitigen?
| FlamingArt hat geschrieben: | | Code: | /** Der Variable(ich würde sagen das das ein Object ist) getAgn wird eine Variable "className" zugeordnet.
this.className+=" click"; |
|
Falsch, der Wert des class Attributes wird um " click" erweitert
Zuletzt bearbeitet von m am Mo 26.05.2008 18:00, insgesamt 3-mal bearbeitet
|
|
| |
|
|
accessoire
Threadersteller
Dabei seit: 05.02.2007
Ort: -
Alter: 34
Geschlecht:
|
Verfasst Di 27.05.2008 09:39
Titel
|
|
|
Danke .
| m hat geschrieben: | Ich verstehe nicht wo du hier die Barriere denkst zu beseitigen?
|
Das Menü sollte auch ohne Maus erreichbar sein? Danke für die Hilfestellungen. Ich muss das zwar jetzt nicht mehr machen aber war doch gut, dass ich das in mich reingepresst hab - so hab ich mal einen Einstieg in JS bekommen.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Printer versucht Webdesign [Haha!]
Hilfe Mein Rechner spinnt, hab alles versucht!
Kann der MAC confirm() verstehen??
if-Abfragen im Allgemeinen verstehen
Anzeigenecken gestalten und verstehen
IFrame und .asp verstehen sich nicht?
|
|
Willkommen auf dem Portal für Mediengestalter
