Mouse Follow zweier div-Elemente

[KarlosKrätze]

Hallo.

Ich habe mich heute mit einen Script beschäftigt, der ein div-Element der Maus folgen lässt.

Leider sind meine JScript-Kenntnisse nicht so gut, als dass ich selber auf eine Lösung meines Problems komme. Ich hoffe, dass auch ich bald in der Lage bin, mit JScript richtig umgehen zu können =)

Die JScript-Funktion follow() lässt das erste Element mit "HalloWelt1" der Maus folgen und die Funktion follow2() sollte eigentlich dafür sorgen, dass auch das zweite Element mit "Hallo Welt2" der Maus folgt.

Komischerweise wird in diesem Fall aber nur die zweite Funktion zur Geltung genommen, als ob die erste ignoriert wird.
Ich denke auch nicht, dass der Fehler in der Funktion selbst liegt, sondern eher in dem Aufruf dieser beiden Funktion.

Kann mir vielleicht jemand helfen und mir erklären, warum das so ist?
Ich wäre sehr dankbar dafür =)

<div id="Box1" style="position:absolute">Hallo Welt1</div>  
<div id="Box2" style="position:absolute">Hallo Welt2</div>  
  

<script type="text/javascript" language="javascript">  
 var offX = 15; // X offset from mouse position  
 var offY = 15; // Y offset from mouse position  
 function mouseX(evt) {  
  if (!evt) evt = window.event;  
  if (evt.pageX) return evt.pageX;  
  else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ?  document.documentElement.scrollLeft : document.body.scrollLeft);  
  else return 0;  
 }  
 function mouseY(evt) {  
  if (!evt) evt = window.event;  
  if (evt.pageY) return evt.pageY;  
  else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);  
  else return 0;  
 }  
 function follow(evt) {if (document.getElementById) {var obj = document.getElementById('Box1').style; obj.visibility = 'visible';  
  obj.left = (parseInt(mouseX(evt))+offX) + 'px';  
  obj.top = (parseInt(mouseY(evt))+offY) + 'px';}  
 }  
  function follow2(evt) {if (document.getElementById) {var obj = document.getElementById('Box2').style; obj.visibility = 'visible';  
  obj.left = (parseInt(mouseX(evt))+offX) + 'px';  
  obj.top = (parseInt(mouseY(evt))+offY) + 'px';}  
 }  
 document.onmousemove = follow;  
 document.onmousemove = follow2;  
</script>

[LX]

Hallo!

document.onmousemove = follow;
document.onmousemove = follow2;

In der 2. Zeile überschreibst Du die erste Zeile. Richtig wäre

document.onmousemove = function() { follow(); follow2(); }

Gruß, LX

[KarlosKrätze]

Hallo!

document.onmousemove = follow;
document.onmousemove = follow2;
In der 2. Zeile überschreibst Du die erste Zeile. Richtig wäre

document.onmousemove = function() { follow(); follow2(); }

Gruß, LX

Hallo LX, danke für die schnelle Antwort ^^

Ich habe deinen Lösungvorschlag natürlich sofort ausprobiert und muss leider feststellen, dass dies nur im Internet Explorer (v6.0) geht.
Im Firefox (v2.0) geht dies leider nicht, beide DIV-Elemente bewegen sich dort nicht.
Gibt es da noch eine andere Möglichkeit, um auch im Firefox die beiden Elemente bewegen zu lassen?

[Felix Riesterer]

Lieber LX,

document.onmousemove = function() { follow(); follow2(); }

Du hast vergessen, das event-Objekt weiterzureichen!

document.onmousemove = function (e) { follow(e); follow2(e); };

Liebe Grüße,

Felix Riesterer.

[KarlosKrätze]

Lieber LX,

document.onmousemove = function() { follow(); follow2(); }

Du hast vergessen, das event-Objekt weiterzureichen!

document.onmousemove = function (e) { follow(e); follow2(e); };

Liebe Grüße,

Felix Riesterer.

OMG !
Ich danke dir ! =o
Dass es so einfach ist, hätt ich nie gedacht !
Es funktioniert.

[ChrisB]

Hi,

Ich habe mich heute mit einen Script beschäftigt, der ein div-Element der Maus folgen lässt.

Leider sind meine JScript-Kenntnisse nicht so gut, als dass ich selber auf eine Lösung meines Problems komme. Ich hoffe, dass auch ich bald in der Lage bin, mit JScript richtig umgehen zu können =)

Zum „damit umgehen können” gehört btw. auch, auf unsinnige Nerv-Scripte zu verzichten ...
http://aktuell.de.selfhtml.org/weblog/javascript-einsatz

Komischerweise wird in diesem Fall aber nur die zweite Funktion zur Geltung genommen, als ob die erste ignoriert wird.

Sie wird nicht „ignoriert”, sondern du selber überschreibst den ersten Eventhandler hier:

document.onmousemove = follow;
document.onmousemove = follow2;

so dass nur noch der zweite bestehen bleibt.

MfG ChrisB

[KarlosKrätze]

Zum „damit umgehen können” gehört btw. auch, auf unsinnige Nerv-Scripte zu verzichten ...
http://aktuell.de.selfhtml.org/weblog/javascript-einsatz

Dessen bin ich mir bewusst, danke =)
Nur diesmal benötige ich diesen Script wirklich und mache nicht Gebrauch von 'Spielereien'.

Sie wird nicht „ignoriert”, sondern du selber überschreibst den ersten Eventhandler hier:

document.onmousemove = follow;
document.onmousemove = follow2;
so dass nur noch der zweite bestehen bleibt.

Danke für den Hinweis.