让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 对象是否存在判断
Jul 15 Javascript
javascript中的作用域scope介绍
Dec 28 Javascript
Javascript 键盘事件的组合使用实现代码
May 04 Javascript
ECMAScript 6即将带给我们新的数组操作方法前瞻
Jan 06 Javascript
正则表达式优化JSON字符串的技巧
Dec 24 Javascript
使用node+vue.js实现SPA应用
Jan 28 Javascript
用JS中split方法实现彩色文字背景效果实例
Aug 24 Javascript
json定义及jquery操作json的方法
Oct 03 Javascript
vue中的非父子间的通讯问题简单的实例代码
Jul 19 Javascript
jQuery判断网页是否已经滚动到浏览器底部的实现方法
Oct 27 jQuery
在Echarts图中给坐标轴加一个标识线markLine
Jul 20 Javascript
详谈vue中router-link和传统a链接的区别
Jul 22 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
Zerg基本策略
2020/03/14 星际争霸
浅谈PHP 闭包特性在实际应用中的问题
2009/10/30 PHP
深入解析PHP中逗号与点号的区别
2013/08/05 PHP
php教程之魔术方法的使用示例(php魔术函数)
2014/02/12 PHP
php禁止直接从浏览器输入地址访问.php文件的方法
2014/11/04 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
Laravel5.7框架安装与使用学习笔记图文详解
2019/04/02 PHP
php基于 swoole 实现的异步处理任务功能示例
2019/08/13 PHP
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
2009/08/04 Javascript
jquery 应用代码 方便的排序功能
2010/02/06 Javascript
jQuery 幻灯片插件(带缩略图功能)
2011/01/24 Javascript
JavaScript中__proto__与prototype的关系深入理解
2012/12/04 Javascript
JS实现淡蓝色简洁竖向Tab点击切换效果
2015/10/06 Javascript
JavaScript高级教程5.6之基本包装类型(详细)
2015/11/23 Javascript
javascript性能优化之DOM交互操作实例分析
2015/12/12 Javascript
解析JavaScript实现DDoS攻击原理与保护措施
2016/12/26 Javascript
使用vue实现点击按钮滑出面板的实现代码
2017/01/10 Javascript
canvas实现十二星座星空图
2017/02/14 Javascript
激动人心的 Angular HttpClient的源码解析
2017/07/10 Javascript
浅谈SpringMVC中post checkbox 多选框value的值(隐藏域方式)
2018/01/08 Javascript
Vue.js添加组件操作示例
2018/06/13 Javascript
vue router 源码概览案例分析
2018/10/09 Javascript
JavaScript设计模式之观察者模式实例详解
2019/01/16 Javascript
微信小程序canvas绘制圆角base64图片的实现
2019/08/18 Javascript
JS中的继承操作实例总结
2020/06/06 Javascript
将Python代码嵌入C++程序进行编写的实例
2015/07/31 Python
纯用NumPy实现神经网络的示例代码
2018/10/24 Python
Python continue语句实例用法
2020/02/06 Python
python爬虫要用到的库总结
2020/07/28 Python
HTML table 表格边框的实现思路
2019/10/12 HTML / CSS
公司JAVA开发面试题
2015/04/02 面试题
应届毕业生个人自荐信范文
2013/11/30 职场文书
初二物理教学反思
2014/01/29 职场文书
丑小鸭教学反思
2014/02/03 职场文书
教师试用期自我鉴定
2014/02/12 职场文书
建国大业观后感800字
2015/06/01 职场文书