JavaScript/DOM/Event/clientX

Die Eigenschaft clientX, clientY (Anzeigebereich-relative Mauszeiger-Position) nach der Microsoft-Syntax) speichert die horizontalen Pixel (clientX) und die vertikalen Pixel (clientY) der Mauszeiger-Position relativ zur oberen linken Ecke des Anzeigebereichs des Fensters, in dem das aktuelle Dokument dargestellt wird. Bezieht sich z. B. auf Mausereignisse.

Beispiel ansehen …

    function Mausklick (Ereignis) {
 
      if (!Ereignis) Ereignis = window.event;
 
      if (document.getElementById) {
          document.getElementById("Springer").style.left = Ereignis.clientX + "px";
          document.getElementById("Springer").style.top = Ereignis.clientY + "px";
      } 
    }
 
    document.onmousedown = Mausklick;

Das Beispiel enthält einen div-Bereich, der mit Hilfe von Stylesheet-Angaben absolut positioniert wird. Wenn der Anwender mit der Maus in das Fenster klickt, wird der Bereich an die Position verschoben, an der der Mausklick erfolgt. Der div-Bereich wird über document.getElementById() angesprochen, je nachdem, welches Objekt zur Verfügung steht.

Beachten Sie: Gehen Sie mit dem dargestellten Beispiel vorsichtig um. Es kann Ihnen passieren, dass der "Layer" sich über wichtige andere Seitenbestandteile schiebt und dadurch Verweise zu anderen Seiten eventuell überdeckt werden.