让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 相关文章推荐
js完美的div拖拽实例代码
Jan 22 Javascript
通过url查找a元素并点击
Apr 09 Javascript
JavaScript严格模式禁用With语句的原因
Oct 20 Javascript
HTML5使用DeviceOrientation实现摇一摇功能
Jun 05 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
Apr 17 Javascript
微信小程序链接传参并跳转新页面
Nov 29 Javascript
微信小程序 swiper制作tab切换实现附源码
Jan 21 Javascript
分享一个精简的vue.js 图片lazyload插件实例
Mar 13 Javascript
jQuery实现的手风琴侧边菜单效果
Mar 29 jQuery
Angularjs2不同组件间的通信实例代码
May 06 Javascript
vue 插件的方法代码详解
Jun 06 Javascript
ant design vue的form表单取值方法
Jun 01 Vue.js
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 读取文件的正确方法
2009/04/29 PHP
PHP 字符串编码截取函数(兼容utf-8和gb2312)
2009/05/02 PHP
php 数组动态添加实现代码(最土团购系统的价格排序)
2011/12/30 PHP
浅谈php中urlencode与rawurlencode的区别
2016/09/05 PHP
ThinkPHP类似AOP思想的参数验证的实现方法
2019/12/18 PHP
从零开始学习jQuery (四) jQuery中操作元素的属性与样式
2011/02/23 Javascript
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
js 取时间差去掉周六周日实现代码
2012/12/25 Javascript
jQuery针对各类元素操作基础教程
2014/08/29 Javascript
JavaScript判断文件上传类型的方法
2014/09/02 Javascript
JavaScript中的object转换函数toString()与valueOf()介绍
2014/12/31 Javascript
Vue.js每天必学之构造器与生命周期
2016/09/05 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
微信小程序 网络请求(post请求,get请求)
2017/01/17 Javascript
VUE长按事件需求详解
2017/10/18 Javascript
基于express中路由规则及获取请求参数的方法
2018/03/12 Javascript
vue-cli3.0+element-ui上传组件el-upload的使用
2018/12/03 Javascript
详解原生JS动态添加和删除类
2019/03/26 Javascript
简单了解微信小程序 e.target与e.currentTarget的不同
2019/09/27 Javascript
javascript json对象小技巧之键名作为变量用法分析
2019/11/11 Javascript
JS数组方法concat()用法实例分析
2020/01/18 Javascript
用于统计项目中代码总行数的Python脚本分享
2015/04/21 Python
Python脚本简单实现打开默认浏览器登录人人和打开QQ的方法
2016/04/12 Python
python3 requests中使用ip代理池随机生成ip的实例
2018/05/07 Python
Python多版本开发环境管理工具介绍
2019/07/03 Python
python中的colorlog库使用详解
2019/07/05 Python
Python使用itchat 功能分析微信好友性别和位置
2019/08/05 Python
关于Python解包知识点总结
2020/05/05 Python
Keras框架中的epoch、bacth、batch size、iteration使用介绍
2020/06/10 Python
Python如何解除一个装饰器
2020/08/07 Python
Ooni英国官网:披萨烤箱
2020/05/31 全球购物
android面试问题与答案
2016/12/27 面试题
一份报关员的职业规划范文
2014/01/08 职场文书
安全员岗位职责
2015/02/10 职场文书
村官个人总结范文
2015/03/03 职场文书
高并发下Redis如何保持数据一致性(避免读后写)
2022/03/18 Redis