Inhalt

Einleitung Voraussetzungen Pop Up, Pop down gleich loslegen und gestalten vorknöpfen weg damit aufpolieren und es bewegt sich doch viel Arbeit! Fang die Maus! ja wo ist sie denn? Schiebung! packen wir's an und Tschüss Casting Schleife drum Das Ganze Flatter, flatter Vorhang auf! Klappe zu!

---

Service

Kontakt & Feedback

CSS Anwendung

Pop Up, Pop down

ja wo ist sie denn?

Die ersten Schritte haben noch gar nichts Greifbares gebracht, und du kannst nicht beurteilen, ob bis jetzt alles in Ordnung ist oder nicht. Damit wir wenigstens schon mal sehen können, ob unsere Mausverfolgungsjagd funktioniert, schlage ich folgendes vor:

1. Ergänze dein Skript mit den folgenden, gelb markierten Zeilen:

   // Die Funktion mousePos ermittelt dauernd die Position der Maus
   function mousePos(evnt){
     if(evnt) {
       sy = evnt.clientY + window.document.body.scrollTop ;
       sx = evnt.clientX + window.document.body.scrollLeft ;
     }
     else {
       sy = event.y + window.document.body.scrollTop ;
       sx = event.x + window.document.body.scrollLeft ;
     }
     document.getElementById("xpos").firstChild.nodeValue = sx ;
     document.getElementById("ypos").firstChild.nodeValue = sy ;
   }
   document.onmousemove = mousePos;
   

   Nun werden nämlich die Maus-Koordinaten nicht nur ermittelt, sondern auch gleich auf der Webseite angezeigt. Wir müssen nur noch bekanntgeben, wo.

2. Stelle irgendwo in deine Seite die folgende Tabelle:

   <table>
   <tr><td>X-Position:</td><td id="xpos">?</td></tr>
   <tr><td>Y-Position:</td><td id="ypos">?</td></tr>
   </table>

   (Wahrscheinlich hast du bereits erkannt, dass die Zellen der Tabelle, die schliesslich die Werte anzeigen sollen, die selben Ids (xpos bzw. ypos) verwenden, die auch in unseren beiden zusätzlichen Javascript-Befehlen vorkommen — ich hab sie hier noch mit etwas Gold hinterlegt.)

3. Lass nun deine Webseite anzeigen — die Mausbewegungen müssten nun etwa so sichtbar sein, wie's hier unten der Fall ist.

Mausposition
X-Position:	?
Y-Position:	?

Wenn's nicht funktioniert, kann ich nur Tippfehler als mögliche Ursache vermuten.

Wenn's funktioniert, ist so weit schon mal alles richtig und du kannst die beiden Zusatzzeilen wieder aus dem Javascript entfernen.