让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 相关文章推荐
用htc组件制作windows选项卡
Jan 13 Javascript
jQuery validate 中文API 附validate.js中文api手册
Jul 31 Javascript
JS图片根据鼠标滚动延时加载的实例代码
Jul 13 Javascript
jQuery中:header选择器用法实例
Dec 29 Javascript
js控制页面的全屏展示和退出全屏显示的方法
Mar 10 Javascript
每天一篇javascript学习小结(Boolean对象)
Nov 12 Javascript
简单的js表格操作
Sep 24 Javascript
ionic2 tabs使用 Modal底部tab弹出框
Dec 30 Javascript
基于jQuery ztree实现表格风格的树状结构
Aug 31 jQuery
详解VUE Element-UI多级菜单动态渲染的组件
Apr 25 Javascript
浅谈一个webpack构建速度优化误区
Jun 24 Javascript
Vue实现Layui的集成方法步骤
Apr 10 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实现批量检测网站是否能够正常打开的方法
2016/08/23 PHP
php读取XML的常见方法实例总结
2017/04/25 PHP
Laravel 批量更新多条数据的示例
2017/11/27 PHP
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
2012/02/03 Javascript
7款吸引人眼球的jQuery/CSS3特效实例分享
2013/04/25 Javascript
javascript简单实现滑动菜单效果的方法
2015/07/27 Javascript
jquery插件EasyUI中form表单提交实例分享
2016/01/11 Javascript
JQUERY的AJAX请求缓存里的数据问题处理
2016/02/23 Javascript
深入理解JavaScript的async/await
2018/08/05 Javascript
vue项目搭建以及全家桶的使用详细教程(小结)
2018/12/19 Javascript
vue基础之data存储数据及v-for循环用法示例
2019/03/08 Javascript
微信小程序访问豆瓣电影api的实现方法
2019/03/31 Javascript
node Buffer缓存区常见操作示例
2019/05/04 Javascript
Vue使用vue-recoure + http-proxy-middleware + vuex配合promise实现基本的跨域请求封装
2019/10/21 Javascript
[32:36]完美世界DOTA2联赛PWL S3 LBZS vs CPG 第二场 12.12
2020/12/16 DOTA
python支持断点续传的多线程下载示例
2014/01/16 Python
python测试驱动开发实例
2014/10/08 Python
把项目从Python2.x移植到Python3.x的经验总结
2015/04/20 Python
Python的socket模块源码中的一些实现要点分析
2016/06/06 Python
Python自动发邮件脚本
2017/03/31 Python
利用Anaconda简单安装scrapy框架的方法
2018/06/13 Python
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
2019/03/27 Python
Python数据类型之列表和元组的方法实例详解
2019/07/08 Python
对YOLOv3模型调用时候的python接口详解
2019/08/26 Python
python实现IOU计算案例
2020/04/12 Python
戴森美国官网:Dyson美国
2016/09/11 全球购物
美国折扣网站:jClub
2017/08/07 全球购物
美国校服网上商店:French Toast
2019/10/08 全球购物
static函数与普通函数有什么区别
2015/12/25 面试题
求两个数的乘积和商数,该作用由宏定义来实现
2013/03/13 面试题
主题党日活动总结
2014/07/08 职场文书
学校德育工作总结2015
2015/05/11 职场文书
2015年高一班主任工作总结
2015/05/13 职场文书
2019奶茶店创业计划书范本!
2019/07/15 职场文书
MySQL中in和exists区别详解
2021/06/03 MySQL
php 文件上传至OSS及删除远程阿里云OSS文件
2021/07/04 PHP