Search code examples
javascriptcursor-position

Capturing cursor position in javascript inline with element

I am trying to make a div popup next to the mouse when a table cell is hovered over.

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

Is it possible to get the cursor position with my bubblePopup function.

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);
}

I would prefer native javascript(but will consider jquery options too). It only needs to work in Firefox 3.5 and up.

Solution

  • I slapped together a fiddle that might get you on the right track.

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

    (Edited to pretty it up slightly)