event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) - document.body.clientLeft + "px";

event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) - document.body.clientTop + "px";

View Code

function showDiv(i) {divSeat(i);document.getElementById('forumlist_menudiv'+i).style.display = "block"; //显示div
}
function hideDiv(i) {divSeat(i);document.getElementById('forumlist_menudiv'+i).style.display = "none"; //隐藏div
}function divSeat(i) {var pos = getElementPos(document.getElementById("showmydiv"));
//    document.getElementById("forumlist_menudiv"+i).style.left = pos[0] + 35 + "px";//    document.getElementById("forumlist_menudiv"+i).style.top = pos[1] + 23 + "px";
document.getElementById("forumlist_menudiv" + i).style.left = event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) - document.body.clientLeft + "px";document.getElementById("forumlist_menudiv" + i).style.top = event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) - document.body.clientTop + "px";
}
function getElementPos(obj) {var left = 0;var top = 0;if (obj.x) {left = obj.x;top = obj.y;} else if (obj.offsetParent) {while (obj.offsetParent) {left += obj.offsetLeft;top += obj.offsetTop;obj = obj.offsetParent;}}return [left, top]; //作为一个数组返回
}/*
<style>
.popupmenu_div{border:solid 1px #CCC; position:absolute; left:0; top:0; z-index:3000}
.popupmenu_div dl{ padding:0px 0 0 0px; clear:both;}
.popupmenu_div dl dt{ color:#666; padding-left:5px;}
.popupmenu_div dl dd{ padding-left:25px;}
.popupmenu_div dl dt a{ color:#666;}
.popupmenu_div dl dt a:hover{ color:#666; text-decoration:underline;}
.popupmenu_div dl dd a{ color:#0058A6;}
.popupmenu_div dl dd a:hover{ color:#0058A6; text-decoration:underline;}
</style><div style="margin-left:600px" id="showmydiv"><div  οnmοuseοut="hideDiv()" οnmοuseοver="showDiv()">More</div></div>
<div class="popupmenu_div" id="forumlist_menudiv" οnmοuseοver="showDiv();" οnmοuseοut="hideDiv()" style="display:none">
<dl>
<p >要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;要显示和隐藏的内容;</p></dl>
</div>
*/

转载于:https://www.cnblogs.com/wugang/archive/2012/06/19/2555096.html

JS 获取 鼠标 坐标相关推荐

  1. html5 js获取鼠标坐标,js怎么获取鼠标在div中的相对位置

    大家在做网页的时候都可能会用到鼠标在div中的相对位置,那么怎么获取鼠标在div中的相对位置呢?下面由学习啦小编教大家怎么获取鼠标在div中的相对位置吧. 如何获取鼠标在div中的相对位置 代码如下: ...

  2. CSS自定义鼠标样式。JS获取鼠标坐标,实现提示气泡框跟随鼠标移动

    cursor: url(//img.58cdn.com.cn/resource/xxzl/captcha/pencil.png), default; ​​​​​​​ /*获取鼠标位置,让提示气泡框跟随 ...

  3. 多兼容的JS获取鼠标坐标

    //第一.相对于屏幕 function getMousePos(event) {var e = event || window.event;return {'x':e.screenX,'y':scre ...

  4. 最全的获取鼠标坐标的方法

    今天给朋友们分享js获取鼠标坐标的最全方法集合: HTML.CSS与JS代码如下: <!DOCTYPE HTML> <html lang="zh-cn"> ...

  5. JS实时获取鼠标坐标

    简单练习,先上图 非常简单,只是一个onmousemove事件的处理 <!DOCTYPE html> <html lang="en"> <head&g ...

  6. JS获取鼠标位置,兼容IE FF

    JS获取鼠标位置,兼容IE FF 由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事 ...

  7. 基于JQuery实现鼠标滑过(类似hover)图片(或Canvas),实时获取鼠标坐标位置

    前言: 尝试制作web端物体标注的时候,虽然利用Canvas可以标注物体,但缺少像LabelImg那样可以利用十字星定位鼠标起点的辅助功能.一直认为可以通过鼠标hover事件实时获取鼠标位置,尝试后无 ...

  8. VUE预览PDF文件并利用pdf.js获取鼠标选中的文字和搜索,在iframe中获取选中文字,监听鼠标事件,右键菜单

    一.VUE预览PDF文件并利用pdf.js获取鼠标选中的文字和搜索 需求实现:vue实现预览pdf文件,获取到鼠标选中的文字数据.调用pdf.js自带的搜索方法实现搜索功能(后期可以调用该接口满足其他 ...

  9. js获取鼠标所在html元素的id和属性

    js获取鼠标所在html元素的id和属性: Code: <div onclick="Get_srcElement()"> <div id="001&qu ...

最新文章

  1. 数据结构(1)有序表查找
  2. 好文推荐,15 分钟教你搞懂 Git!
  3. 一篇绝好的讲sql server索引的文章,值得收藏
  4. ACTIONSCRIPT 3.0著名开源库 大集合
  5. MVC强类型和弱类型的区别
  6. iOS Hacker Keychain相关The executable was signed with invalid entitlements
  7. Spring Data JPA 从入门到精通~实际工作的应用场景
  8. 浅谈长连接的平滑重启
  9. centos报acpi 错误解决方法实测有用
  10. 【C语言】指向一维数组元素的指针
  11. Win7主题文件themepack不能安装,低级错误!
  12. 减治法——生成组合对象
  13. mysql报错1194_ERROR 1194 (HY000): Table 't1' is marked as crashed and should be repaired
  14. win10 uwp 使用 Border 布局
  15. const T vs. T const by Dan Saks
  16. 中国染料产业竞争格局分析与消费需求调研报告2022版
  17. 申请https证书相关说明
  18. 【非原创】Ubuntu14.04+cuda6.5+opencv2.4.9+caffe配置记录
  19. 【pytorch】torchvision.transforms 图像的变换详解;图像的预处理;数据增强
  20. python处理excel合并单元格的拆分和填补

热门文章

  1. Linux下安装mysql遇到的一些问题及解决办法
  2. 介绍几个好用的android自定义控件
  3. [leetcode] Pow(x, n)
  4. JSP自定义标签渲染时报Illegal to flush错误
  5. 关于C#写的记事本中一个问题
  6. LeetCode_Convert Sorted Array to Binary Search Tree(Java实现)
  7. android js变量定义数组长度,js 声明数组和向数组中添加对象变量的简单实例
  8. 2017c语言考核册答案,2017年最新C语言考题带答案
  9. OverFeat: Integrated Recognition, Localization and Detection using Convolutional Networks
  10. 机器学习知识点(二十五)Java实现隐马尔科夫模型HMM之jahmm库