让div层随鼠标移动的实现代码 ie ff


Posted in Javascript onDecember 18, 2009

.center_div2
{
position: absolute;
z-index: 1;
text-align: center;
display: none;
background-color: #e0e7ef;
}

.center_div_tips2
{
position: relative;
color: Red;
}
<div id="detailDiv" class="center_div2">
<span class="center_div_tips2"><img src="http://img.3water.com/imgby/loading.gif" alt="" />数据更新中...</span>
</div>

function IsIE() { 
var OsObject = ""; 
if (navigator.userAgent.indexOf("MSIE") > 0) { 
return true; 
} 
} 
function mouseMove(ev) { 
/*ie 与ff的event 机制不同*/ 
ev = ev || window.event; 
var mousePos = mouseCoords(ev); 
var detailDiv = document.getElementById("detailDiv"); //将要弹出的层 
detailDiv.style.left = (mousePos.x + 10) + "px"; 
detailDiv.style.top = (mousePos.y + 18) + "px"; 
} 
function mouseCoords(ev) { 
if (ev.pageX || ev.pageY) { 
return { 
x: ev.pageX, 
y: ev.pageY 
}; 
} 
/*ie 与 ff的边界 处理不同*/ 
if (IsIE()) { 
return { x: ev.clientX + document.documentElement.scrollLeft - document.documentElement.clientLeft, y: ev.clientY + document.documentElement.scrollTop - document.documentElement.clientTop } 
} 
else { 
return { x: ev.clientX + document.body.scrollLeft - document.body.clientLeft, y: ev.clientY + document.body.scrollTop - document.body.clientTop } 
} 
} 
document.onkeydown = keydown;
Javascript 相关文章推荐
Javascript 学习书 推荐
Jun 13 Javascript
js弹出层之1:JQuery.Boxy (二)
Oct 06 Javascript
jQuery 选择表格(table)里的行和列及改变简单样式
Dec 15 Javascript
基于javascript显示当前时间以及倒计时功能
Mar 18 Javascript
JS函数arguments数组获得实际传参数个数的实现方法
May 28 Javascript
Javascript中apply、call、bind的巧妙使用
Aug 18 Javascript
详解ES6之用let声明变量以及let loop机制
Jul 15 Javascript
移动前端图片压缩上传的实例
Dec 06 Javascript
学习LayUI时自研的表单参数校验框架案例分析
Jul 29 Javascript
vue-cli3跨域配置的简单方法
Sep 06 Javascript
如何解决日期函数new Date()浏览器兼容性问题
Sep 11 Javascript
js实现时间日期校验
May 26 Javascript
Javascript在IE或Firefox下获取鼠标位置的代码
Dec 18 #Javascript
javascript 导出数据到Excel(处理table中的元素)
Dec 18 #Javascript
event.srcElement 用法笔记e.target
Dec 18 #Javascript
Javascript document.referrer判断访客来源网址
May 15 #Javascript
Javascript 中介者模式实例
Dec 16 #Javascript
js textarea自动增高并隐藏滚动条
Dec 16 #Javascript
javascript 动态设置已知select的option的value值的代码
Dec 16 #Javascript
You might like
php strstr查找字符串中是否包含某些字符的查找函数
2010/06/03 PHP
Laravel框架中实现使用阿里云ACE缓存服务
2015/02/10 PHP
php原生导出excel文件的两种方法(推荐)
2016/11/19 PHP
javascript整除实现代码
2010/11/23 Javascript
jquery实现的可隐藏重现的靠边悬浮层实例代码
2013/05/27 Javascript
JavaScript模块化开发之SeaJS
2015/12/13 Javascript
基于Vue2的移动端开发环境搭建详解
2016/11/03 Javascript
javascript实现复选框全选或反选
2017/02/04 Javascript
js简单实现网页换肤功能
2017/04/07 Javascript
js中变量的连续赋值(实例讲解)
2017/07/08 Javascript
详解bootstrap用dropdown-menu实现上下文菜单
2017/09/22 Javascript
详解如何使用PM2将Node.js的集群变得更加容易
2017/11/15 Javascript
原生js实现trigger方法示例代码
2019/05/22 Javascript
Nuxt.js实战和配置详解
2019/08/05 Javascript
Vue前端项目部署IIS的实现
2020/01/06 Javascript
JS删除数组指定值常用方法详解
2020/06/04 Javascript
js用正则表达式筛选年月日的实例方法
2021/01/04 Javascript
Python中的sort()方法使用基础教程
2017/01/08 Python
python中dir()与__dict__属性的区别浅析
2018/12/10 Python
python系统指定文件的查找只输出目录下所有文件及文件夹
2020/01/19 Python
如何理解python中数字列表
2020/05/29 Python
python中PyQuery库用法分享
2021/01/15 Python
CSS3轻松实现圆角效果
2017/11/09 HTML / CSS
HTML5里autofocus自动聚焦属性使用介绍
2016/06/22 HTML / CSS
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
出口公司经理求职简历中的自我评价
2013/10/13 职场文书
车间操作工岗位职责
2013/12/19 职场文书
竞聘自述材料
2014/08/25 职场文书
农行心得体会
2014/09/02 职场文书
2015年见习期工作总结
2014/12/12 职场文书
班主任自我评价范文
2015/03/11 职场文书
2015年英语教学工作总结
2015/05/25 职场文书
Windows10下安装MySQL8
2021/04/06 MySQL
用python基于appium模块开发一个自动收取能量的小助手
2021/09/25 Python
php去除数组中为0的元素的实例分析
2021/11/17 PHP
vue中控制mock在开发环境使用,在生产环境禁用方式
2022/04/06 Vue.js