Bereiche für die Maus definieren, für mouseenter

Noeden

Erfahrenes Mitglied
Hallo Leute,

ich habe ein Element, und wenn die Maus auf verschiedenen Berecihen des Elementes ist, sollen verschiedene Sachen passieren. Im Moment versuche ich das mit mouseover zu lösen und verrechne die position des Events mit der Position des Elements und berechne so, in welchem Bereich das ausgeführt worden ist.

Gibt es eine Methode, mouseenter für diese Bereiche zu definieren? (Außer mit einer Variablen, die den letzten Bereich, in dem ein Mouseover verwertet worden ist, speichert und dann wiederholtes ausführen des Codes verhindert?)

Danke
 
Was ist es denn für ein Element? Vielleicht kannst du ja mit ImageMaps etwas "basteln".

Nachtrag, kleines Beispiel:

HTML:
<script language="javascript" type="text/javascript">
aktiv = -1;
function bereich(wert) {
farbe = new Array("#FFFF00", "#FF0000", "#0000FF", "#C0C0C0");
if (aktiv != wert) {
	aktiv = wert;
	alert ("Jetzt im Bereich " + wert);
	document.getElementById("div").style.backgroundColor= farbe[wert];
}
}
</script>
<img src="bild.jpg" width="100" height="100" border="0" usemap="#karte"/>
<map name="karte">
	<area shape="rect" coords="1,1,50,50" onmousemove="bereich(0);"/>
	<area shape="rect" coords="50,1,100,50" onmousemove="bereich(1);"/>
	<area shape="rect" coords="1,50,50,100" onmousemove="bereich(2);"/>
	<area shape="rect" coords="50,50,100,100" onmousemove="bereich(3);"/>
</map>
<div style="width: 100; height: 100; background-color: #FFFFFF;" id="div">&nbsp;</div>

Zur Not einfach ein durchsichtiges Bild über das Element legen.
 
Zuletzt bearbeitet:
Das mit dem durchsichtigen Bild ist eine super Idee, aber die Bereiche verändern ihre Position zueinander. Ich habe es jetzt, wovor ich mich eigentlich drücken wollte, mit absolut positionierten Divs gemacht. Funktioniert auch 1a. Aber herzlichen Danke. Falls jemand noch eine super Idee hat? :)

Sonst schließe ich das Thema heute abend. Aber danke für deine Mühen :)
 
Kannst du nicht mal ein bisschen genauer beschreiben was du da genau machen willst. Dann findet sich vielleicht eher was brauchbares.
 
Also ich möchte eine Hierarchische Liste sortieren und erweitern per drag&drop. Wenn man über dem LI dann über verschiedenen Bereichen ist mit der Maus solen verschiedene Funktionen ausgeführt werden. Ich nehme bewusst nicht droppable oder sortable von jQuery Ui. Naja und wenn eine ul in einem li geöffnet wird, dann gibt es halt neue Funktionen bzw die Flächen müssen woanders hin ;)

Danke für deine Mühen aber ich glaube mittlerweile, dass die DIV-Lösung gar nicht so schlecht ist. Ab jetzt ist es nur noch interesse wie Profis das lösen würden.
 
Zurück