【js获取鼠标位置】js获取鼠标位置(兼容 Firefox 3.6, Opera 10.10, Chrome 4.1)

更新时间:2017-03-08    来源:js教程    手机版     字体:

【www.bbyears.com--js教程】

js获取鼠标位置(兼容 Firefox 3.6, Opera 10.10, Chrome 4.1)

<script language="网页特效">
function document.onmouseo教程ver()
{
  document.all("txtbox").value=event.screenX+"x"+event.screenY;
}

private void Button1_Click(object sender, System.EventArgs e)
{
this.TextBox1.Text=txtbox.Value;
}

完整实例


**
 * 获取鼠标在页面上的位置
 * @param ev  触发的事件
 * @return   x:鼠标在页面上的横向位置, y:鼠标在页面上的纵向位置
 */
function getMousePoint(ev) {
 // 定义鼠标在视窗中的位置
 var point = {
  x:0,
  y:0
 };
 
 // 如果浏览器支持 pageYOffset, 通过 pageXOffset 和 pageYOffset 获取页面和视窗之间的距离
 if(typeof window.pageYOffset != "undefined") {
  point.x = window.pageXOffset;
  point.y = window.pageYOffset;
 }
 // 如果浏览器支持 compatMode, 并且指定了 DOCTYPE, 通过 documentElement 获取滚动距离作为页面和视窗间的距离
 // IE 中, 当页面指定 DOCTYPE, compatMode 的值是 CSS1Compat, 否则 compatMode 的值是 BackCompat
 else if(typeof document.compatMode != "undefined" && document.compatMode != "BackCompat") {
  point.x = document.documentElement.scrollLeft;
  point.y = document.documentElement.scrollTop;
 }
 // 如果浏览器支持 document.body, 可以通过 document.body 来获取滚动高度
 else if(typeof document.body != "undefined") {
  point.x = document.body.scrollLeft;
  point.y = document.body.scrollTop;
 }
 
 // 加上鼠标在视窗中的位置
 point.x += ev.clientX;
 point.y += ev.clientY;
 
 // 返回鼠标在视窗中的位置
 return point;
}
IE 以外的浏览器 (本人测试过 Firefox 3.6, Opera 10.10, Chrome 4.1 和 Safari 4.0.4) 均可以通过 pageXOffset 和 pageYOffset 来获取页面和视窗间的横纵距离. 但 IE (本人测试过 IE6, IE7, IE8) 只能通过滚动位移来获取页面和视窗间的距离, 并存在一到两个像素的偏离.


再看个应用实例html+js



<script language="javascript" type="text/javascript">

</script>
get mouse position




-------------------------------------------------------------------------------------------------
总的来说:
x=document.body.scrollLeft+event.clientX; //获取当前鼠标位置的X坐标
y=document.body.scrollTop+event.clientY; //获取当前鼠标位置的Y坐标

 

本文来源:http://www.bbyears.com/wangyezhizuo/31021.html

猜你感兴趣

热门标签

更多>>

本类排行