Dynamische elemente erzeugen + event listener für style änderung

[Matthias]

Hi.

Wahrscheinlich stehts schon irgendwo, aber ich formulier trotzdem nochmal mein Problem:

Ich erzeuge mit createElement und appendChild neue elemente zu einem parent. Diese Elemente sollen sich aber auch noch beim mouseover farblich verändern. Krieg ich irgendwie nich hin :-(

code:

l_subMenu = document.createElement("div");
l_subMenu.setAttribute ("id", l_entry.getID());
l_subMenu.className = "_subMenu_entry";
l_subMenu.style.width = a_menu.offsetWidth - 5;
l_menu.appendChild(l_subMenu);

dieses l_subMenu soll halt ein Untermenü werden und beim drauffahren mit der maus gehilited werden. vielleicht hat ja auch jemand ein tutorial für "wie bau ich ein gescheites menü selber" ;-)

danke

[wahsaga]

hi,

l_subMenu = document.createElement("div");
l_subMenu.setAttribute ("id", l_entry.getID());

setAttribute führt im IE oft zu Fehlern, lieber gleich direkt den Wert der Eigenschaft zuweisen:
l_subMenu.id = l_entry.getID();

dieses l_subMenu soll halt ein Untermenü werden

Warum ist es dann ein Div, und kein List Item?

Zur dynamischen Zuweisung von Eventhandlern:

l_subMenu.onmouseover = funktionsname;

function funktionsname() {
  alert(this.id); // this erlaubt hier Zugriff auf das Element, auf dem er Event stattgefunden hat
}

oder

l_subMenu.onmouseover = function() { tu_was_mit(this); }

gruß,
wahsaga

[Struppi]

Ich erzeuge mit createElement und appendChild neue elemente zu einem parent. Diese Elemente sollen sich aber auch noch beim mouseover farblich verändern. Krieg ich irgendwie nich hin :-(

code:

l_subMenu = document.createElement("div");
l_subMenu.setAttribute ("id", l_entry.getID());

die id kannst du auch einfach mit
l_subMenu.id = l_entry.getID();
ändern, die setAttribute Funktion führt manchmal unter dem IE zu Problemen.

l_subMenu.className = "_subMenu_entry";
l_subMenu.style.width = a_menu.offsetWidth - 5;
l_menu.appendChild(l_subMenu);

dieses l_subMenu soll halt ein Untermenü werden und beim drauffahren mit der maus gehilited werden. vielleicht hat ja auch jemand ein tutorial für "wie bau ich ein gescheites menü selber" ;-)

Dazu musst du einfach den Eventhandler entsprechend verbiegen:

l_menu.onmouseover = function(e)
{
if(!e) e = window.event;

// tu was mit dem Element
// l_menu ist hier gleich this

};

Struppi.