js-jquery-获得鼠标所在的坐标(兼容火狐,谷歌)


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



免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM