JQuery
html:
<p id="pTest">Click Me!</p>
<span class="testSpan"></span>
jquery:
$('#pTest').mousemove(function(e) { //传递事件对象e
var sPosPage = "(" + e.pageX + "," + e.pageY + ")";
var sPosScreen = "(" + e.screenX + "," + e.screenY + ")";
$(".testSpan").html("<br>Page: " + sPosPage + "<br>Screen: " + sPosScreen);
});
JS
html:
鼠标X轴:
<input id=xxx type=text>
鼠标Y轴:
<input id=yyy type=text>
js:
function mouseMove(ev) {
Ev = ev || window.event;
var mousePos = mouseCoords(ev);
document.getElementById("xxx").value = mousePos.x;
document.getElementById("yyy").value = mousePos.y;
}
function mouseCoords(ev) {
if (ev.pageX || ev.pageY) {
return {
x: ev.pageX,
y: ev.pageY
};
}
return {
x: ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y: ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
document.onmousemove = mouseMove;
备注:火狐有问题
--------------------------------------------------------------------
//兼容火狐,谷歌
function ScollPostion() {//滚动条top
var t;
if (document.documentElement && document.documentElement.scrollTop) {
t = document.documentElement.scrollTop;
} else if (document.body) {
t = document.body.scrollTop;
}
return t;
}
$('#serverInfo').mousemove(function(e) {
//页面
var pageX=e.pageX;
var pageY=e.pageY;
//滚动条的top
var top = ScollPostion();
var xx = e.originalEvent.x || e.originalEvent.layerX || 0; //x坐标
var yy = e.originalEvent.y || e.pageY-top || 0; //y坐标
$(".dialogLeft").css("left",xx+40);
$(".dialogLeft").css("top",yy);
$(".dialogLeft").css("height",20*$scope.serverInfo.data.length+20);
});