Erfassen cursor-position in der javascript-inline-element

Ich versuche ein div-popup neben dem Mauszeiger, wenn eine Zelle in der Tabelle wird mit der Maus auf.

<td onmouseover="bubblePopup("param1","param2");">This is the cell</td>

Ist es möglich, die cursor-position mit meinem bubblePopup Funktion.

function bubblePopup(param1, param2){
    var newdiv = document.createElement('div');
    newdiv.setAttribute('id', param1);

    newdiv.style.width = "200px";
    newdiv.style.height = "80px";

    newdiv.style.position = "absolute";
    newdiv.style.left = cursorX + "px";
    newdiv.style.top = cursorY + "px";

    newdiv.innerHTML = "content";
    document.body.appendChild(newdiv);
}

Ich würde lieber native javascript(sondern betrachten die jquery Optionen auch). Es muss nur in Firefox 3.5 und höher.

InformationsquelleAutor Mike | 2011-02-11
  1. 4

    Ich schlug zusammen ein Turnschuh, die könnte Sie auf der richtigen Spur.

    http://www.jsfiddle.net/dduncan/WccJw/2/

    (Editiert, um es ziemlich leicht)

    • Irgendwelche Vorschläge, wie ich das machen könnte das destroy-Ereignis nur geschehen, wenn der Mauszeiger nicht über der Zelle in der Tabelle oder die neu erstellten div, so dass ich auf links klicken in das div?
    • Schöner Beispiel, als meine +1
    InformationsquelleAutor Dai
  2. 3

    http://jsfiddle.net/CtCXE/

    var td = document.getElementById("thetd");

td.onmouseover = function(e){bubblePopup(e, 'param1','param2')};

function bubblePopup(e, param1, param2){
    var newdiv = document.createElement('div');
    newdiv.setAttribute('id', param1);

    newdiv.style.width = 200;
    newdiv.style.height = 80;

    var cursorX = e.pageX,
        cursorY = e.pageY;

    newdiv.style.position = "absolute";
    newdiv.style.left = cursorX + 'px';
    newdiv.style.top = cursorY + 'px';

    newdiv.innerHTML = "content";
    document.body.appendChild(newdiv);
}
    InformationsquelleAutor Loktar
Schreibe einen Kommentar