Улавяне на позицията на курсора в javascript, вградено в елемента

Опитвам се да направя изскачащ прозорец div до мишката, когато върху клетка от таблица се задържи курсор.

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

Възможно ли е да получа позицията на курсора с моята функция bubblePopup.

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

Бих предпочел естествен javascript (но ще разгледам и опциите за jquery). Трябва да работи само във Firefox 3.5 и по-нова версия.


javascript cursor-position
person Mike    schedule 11.02.2011    source източник

Отговори (2)


arrow_upward
4
arrow_downward

Ударих една цигулка, която може да те отведе на правия път.

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

(Редактирано, за да го подобри леко)

person Dai    schedule 11.02.2011
comment
Някакви предложения за това как мога да накарам събитието за унищожаване да се случва само когато курсорът не е над клетката на таблицата или новосъздадения div, така че да мога да щракам върху връзки в div? - person Mike; 11.02.2011

arrow_upward
3
arrow_downward

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);
}
person Loktar    schedule 11.02.2011