Ergebnis 1 bis 14 von 14
  1. #1
    Avatar von Tarcon
    Tarcon ist offline Jungspund
    registriert
    04-09-2007
    Ort
    Hamburg
    Beiträge
    11

    [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Hallo JS´ler...

    Ich verzweifle gerade an einem Script, von dem ich sicher bin, dass es eigentlich korrekt funktionieren müsste. Irgendwo steckt aber noch immer ein Fehler, den ich einfach nicht finden kann. Sieht jemand von Euch, was ich falsch mache?

    Zunächst schildere ich Euch, was das Script tut bzw. tun soll.

    Es gibt ein Div im Body-Tag:
    Code:
    <div class="mouseInfoLayer" id="mouseInfoLayer"></div>
    Dazu gehört folgender Style:
    Code:
    .mouseInfoLayer {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	font-weight: normal;
    	color: #000000;
    	background-color: #ffffe1;
    	text-align: left;
    	width: auto;
    	border: 1px solid #000000;
    	position: absolute;
    	z-index: 250;
    	height: auto;
    	padding-top: 5px;
    	padding-right: 5px;
    	padding-bottom: 5px;
    	padding-left: 5px;
    	visibility: hidden;
    }
    Das Script soll nun den Layer, wie ein Browsertooltip, an der Mausposition platzieren. Das passiert auch sowohl im IE6/7 als auch im aktuellen Firefox. Das eigentliche Problem ist die Platzierung, wenn der Anzeigebereich größer ist, als das Browserfenster, also z. B. nach unten gescrollt werden muss.

    Die Position wird für den IE hier mit clientX ausgelesen. Ich bin mir im Klaren darüber, dass pageX sinnvoller wäre, wenn es denn funktionieren würde. Beim Firefox funktioniert es mit pageX nämlich wunderbar und die Probleme treten ausschließlich mit dem IE auf, in meinem Fall mit der 7er Version.

    Nun dache ich, ich lese clientX und clientY aus und addiere einfach document.body.scrollLeft bzw. scrollTop. Leider bleiben diese beiden Werte vollständig leer bzw. undefined, egal wie ich es versuche.

    Kann mir jemand helfen? Ich sitze seit 1,5 Tagen da und weiß nicht mehr, wie ich weitermachen soll.

    Code:
    function init() {
        if (window.event) {
            if (document.captureEvents){
              document.captureEvents(Event.MOUSEMOVE);
            } else {
              window.captureEvents(Event.MOUSEMOVE);
            }
        }
      document.onmousemove = getXY;
    }
    
    init();
    
    function getXY(e) {
      mousex = (window.Event) ? e.pageX : event.clientX; //IE-Alternative zu pageX bzw. clientx offSetX/scrollTop/Left
      mousey = (window.Event) ? e.pageY : event.clientY;
    }
    
    function init() {
        if (window.event) {
            if (document.captureEvents){
              document.captureEvents(Event.MOUSEMOVE);
            } else {
              window.captureEvents(Event.MOUSEMOVE);
            }
        }
      document.onmousemove = getXY;
    }
    
    function createInfo(layerContent) {
    	document.getElementById('mouseInfoLayer').innerHTML=layerContent;
    	document.getElementById('mouseInfoLayer').style.left = mousex+15+'px';
    	document.getElementById('mouseInfoLayer').style.top = mousey+'px';
    	document.getElementById('mouseInfoLayer').style.visibility = 'visible';
    }
    
    function closeInfo() {
    	document.getElementById('mouseInfoLayer').innerHTML='';
    	document.getElementById('mouseInfoLayer').style.visibility = 'hidden';
    }
    Viele Grüße
    Tarcon

  2. #2
    ein schlauer ist offline Lounge-Member
    registriert
    18-08-2004
    Beiträge
    14.671

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Deine Überprüfung auf Netscape 4 ist fehlerhaft, da aber das ganze Skript eh nicht mit dem Browser funktioniert kannst du das auch rauschmeissen.

    Im IE musst du noch ermitteln, ob die Seite im Quirks oder standardmode ist.

    PHP-Code:
    var mousex
    var mousey;
    function 
    getXY(e) {
        if(!
    ewindow.event;
        var 
    body = (window.document.compatMode && window.document.compatMode == "CSS1Compat") ?
        
    window.document.documentElement window.document.body || null;
        
        
    mousey e.pageY e.pageY e.clientY body.scrollTop;
        
    mousex e.pageX e.pageX e.clientX body.scrollLeft;


  3. #3
    Avatar von Tarcon
    Tarcon ist offline Jungspund
    registriert
    04-09-2007
    Ort
    Hamburg
    Beiträge
    11

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Hallo "ein schlauer"!

    Du hast mir wirklich den Tag gerettet, denn es funktioniert einwandfrei. Was Quirks- und Standardmode sind, weiß ich zwar noch nicht, da ich diese Begriffe in Deinem Beitrag das erste Mal gelesen habe, werde mich aber diesbezüglich schlau googlen!

    Vielen Dank für die schnelle Hilfe!!

    Gruß
    Tarcon

  4. #4
    ein schlauer ist offline Lounge-Member
    registriert
    18-08-2004
    Beiträge
    14.671

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Zitat Zitat von Tarcon Beitrag anzeigen
    Was Quirks- und Standardmode sind, weiß ich zwar noch nicht, da ich diese Begriffe in Deinem Beitrag das erste Mal gelesen habe, werde mich aber diesbezüglich schlau googlen!
    Bitte, gern geschehen.

    Genau deshalb hatte ich die Begriffe erwähnt
    Da du keine Ausnahme bist, doch diese Begriffe sind durchaus wichtig, nicht nur für JS, sondern auch für CSS.

  5. #5
    Rincon ist offline Jungspund
    registriert
    14-03-2010
    Beiträge
    20

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Zunäächst Entschuldigung für das Ausgraben dieses alten Themas.

    Ich habe die hier gepostete Funktion getXY(e) bisher erfolgreich verwendet. Allerdings funktioniert sie mit dem IE8 leider nicht mehr.

    Kann mir jemand bzgl. der nötigen Anpassung weiterhelfen?

    Danke schonmal!

    //edit:
    Meine eher schwach ausgeprägten Debugging-Künste haben ergeben, dass nach "if(!e) e = window.event;" jeder Zugriff auf "e" in "mitglied nicht gefunden" resultiert.
    Geändert von Rincon (08-03-2011 um 19:05 Uhr)

  6. #6
    Avatar von mikdoe
    mikdoe ist offline Administrator
    registriert
    01-05-2010
    Beiträge
    7.725

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Ich hab hier eine aktuelle Routine zur Abfrage der Tasten gefunden. Vielleicht kannst du das für die Mausposition irgendwie adaptieren.

    var keycode;
    if (window.event) keycode = window.event.keyCode;
    else if (e) keycode = e.which;
    else return;
    if (keycode == 13) absenden();

  7. #7
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.706

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    @Rincon: das kann ich mir gerade nicht erklären - kannst du bitte einen Testlink machen.

  8. #8
    Rincon ist offline Jungspund
    registriert
    14-03-2010
    Beiträge
    20

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Jap mach ich
    Kommt per PM, ok?

  9. #9
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.706

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    OK - das Problem liegt daran, dass du die Funktion nicht direkt im Event, sondern über einen Timeout aufrufst - da ist das event-Objekt dann nicht mehr gültig und ist zu Recht nicht mehr mit Werten bevölkert (ist im IE ja immer ein globales Element).

    Lösen kannst du das, indem du entweder dein komplettes Design umstellst und nicht im großen div auf onclick, sondern in den einzelnen Parzellen auf onclick reagierst - da hast du dann direkt das ausgewählte Objekt - oder eine lokale Kopie des Event-Objektes erstellst und diese im Timeout weiterverwendest:
    Code:
     var localEvt = {};
    for (var i in evt){
    	localEvt[i] = evt[i];
    }

  10. #10
    Rincon ist offline Jungspund
    registriert
    14-03-2010
    Beiträge
    20

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Super, danke!

    Die Entschedung ist da schnell gefallen. Auf die Parzellen kann ich nicht reagieren, da noch ein halbtransparentes Bild (Spielfeldbegrenzung, etc.) darüber liegt.

    Dann werde ich wohl mal die andere Variante ausprobieren. Danke

  11. #11
    Rincon ist offline Jungspund
    registriert
    14-03-2010
    Beiträge
    20

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Prima, läuft wieder.
    Wenn ich dich richtig verstanden habe, dann war das jetzt kein Problem des IE8, sondern kam durch die Änderung mit dem Timeout für "alle" IEs zustande?

    Ein Problem hab ich jetzt noch: In FF, Chrome und Opera passen die Koordinaten genau zu der Parzelle, über der die Maus auch wirklich gerade ist. Beim IE (7 und 8 gerade getestet) wird allerdings eine (oder 1,5) Parzellen weiter links gewählt... das sind vielleicht 30Pixel oder so die ich in X-Richtung anpassen müsste. Y stimmt. Wie mache ich das am besten "nur für den IE"?

    Grüße

    //edit:
    got it!
    --> mousex = e.pageX ? e.pageX : e.clientX + body.scrollLeft +20;
    Geändert von Rincon (08-03-2011 um 21:54 Uhr)

  12. #12
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.706

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Ok - das Problem ist nicht das auslesen deiner Mausposition - die stimmt ohne die + 20. Das Problem ist, dass die Funktion findPos im IE einen Bug trifft. Was jetzt genau das Problem ist, konnte ich nicht herausfinden, ABER du kannst das Ganze lösen, indem du den Klassen .Sheet-body, .contentLayout und .content_ KEINE position: relative; gibst (ist auch gar nicht nötig).

  13. #13
    ein schlauer ist offline Lounge-Member
    registriert
    18-08-2004
    Beiträge
    14.671

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    Ich muss leider raten, da wir den Code nicht kennen, aber offsetTop/Left sind relative Werte. Vermutlich liegt es daran

  14. #14
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.706

    AW: [Javascript] Hilfe bei Ermittlung der Mouse-Position

    @ein schlauer: da ist irgendetwas im IE falsch: offsetLeft bezieht sich plötzlich nicht mehr auf den nächsten offsetParent, sondern auf den überübernächsten... sehr seltsam. Da die beiden "zwischen"Parents aber keine Positinierung ausführen, kann man auf position: relative; verzichten.

Ähnliche Themen

  1. Genaue Positionierung und Browser
    Von ~red~ im Forum CSS und (X)HTML
    Antworten: 3
    Letzter Beitrag: 31-10-2005, 17:01
  2. Hilfe !!! fertiges [Javascript] funzt nicht ?! EILT
    Von reinhard im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 15-03-2005, 23:56
  3. Mouse Position relativ zum Bildschirm für IE
    Von grisu911 im Forum JavaScript
    Antworten: 6
    Letzter Beitrag: 05-03-2005, 12:30
  4. Navigations-Menü
    Von Angel-M im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 05-02-2005, 21:01

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •