让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设置function参数默认值(适合没有传参情况)
Feb 24 Javascript
node.js中的fs.chown方法使用说明
Dec 16 Javascript
JQuery的ON()方法支持的所有事件罗列
Feb 28 Javascript
jQuery常用的一些技巧汇总
Mar 26 Javascript
js微信扫描二维码登录网站技术原理
Dec 01 Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 Javascript
加快Vue项目的开发速度的方法
Dec 12 Javascript
详解微信小程序-canvas绘制文字实现自动换行
Apr 26 Javascript
react 中父组件与子组件双向绑定问题
May 20 Javascript
vue 使用鼠标滚动加载数据的例子
Oct 31 Javascript
Vue-axios-post数据后端接不到问题解决
Jan 09 Javascript
JavaScript 获取滚动条位置并将页面滑动到锚点
Feb 08 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邮件发送,php发送邮件的类
2011/03/24 PHP
Linux下创建nginx脚本-start、stop、reload…
2014/08/03 PHP
帝国cms常用标签汇总
2015/07/06 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
使用SyntaxHighlighter实现HTML高亮显示代码的方法
2010/02/04 Javascript
mysql输出数据赋给js变量报unterminated string literal错误原因
2010/05/22 Javascript
学习并汇集javascript匿名函数
2010/11/25 Javascript
script标签的 charset 属性使用说明
2010/12/04 Javascript
Jquery判断IE6等浏览器的代码
2011/04/05 Javascript
jQuery中对节点进行操作的相关介绍
2013/04/16 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
2015/11/30 Javascript
jQuery formValidator表单验证
2016/01/07 Javascript
[原创]jQuery常用的4种加载方式分析
2016/07/25 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
微信小程序 后台登录(非微信账号)实例详解
2017/03/31 Javascript
jquery dataTable 获取某行数据
2017/05/05 jQuery
JavaScript实现多态和继承的封装操作示例
2018/08/20 Javascript
vue-cli脚手架打包静态资源请求出错的原因与解决
2019/06/06 Javascript
layui 上传文件_批量导入数据UI的方法
2019/09/23 Javascript
Vue使用vue-draggable 插件在不同列表之间拖拽功能
2020/03/12 Javascript
Python fileinput模块使用介绍
2014/11/30 Python
Python中的字典与成员运算符初步探究
2015/10/13 Python
python解决汉字编码问题:Unicode Decode Error
2017/01/19 Python
使用Python-OpenCV向图片添加噪声的实现(高斯噪声、椒盐噪声)
2019/05/28 Python
python GUI库图形界面开发之PyQt5表单布局控件QFormLayout详细使用方法与实例
2020/03/06 Python
CSS3 旋转立方体问题详解
2020/01/09 HTML / CSS
html5 datalist 选中option选项后的触发事件
2020/03/05 HTML / CSS
expedia比利时:预订航班+酒店并省钱
2018/07/13 全球购物
人力资源管理毕业生自荐信
2013/11/21 职场文书
岗位廉洁从业承诺书
2014/03/28 职场文书
公安机关党的群众路线教育实践活动剖析材料
2014/10/10 职场文书
2015年党员创先争优承诺书
2015/01/22 职场文书
2015年电信员工工作总结
2015/05/26 职场文书
历史博物馆观后感
2015/06/05 职场文书
业务员管理制度范本
2015/08/06 职场文书
仅用几行Python代码就能复制她的U盘文件?
2021/06/26 Python