让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 相关文章推荐
滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码
Dec 28 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
Aug 07 Javascript
Bootstrap中定制LESS-颜色及导航条(推荐)
Nov 21 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
vue2.0父子组件及非父子组件之间的通信方法
Jan 21 Javascript
jQuery基本筛选选择器实例代码
Feb 06 Javascript
jquery 键盘事件的使用方法详解
Sep 13 jQuery
详解js根据百度地图提供经纬度计算两点距离
May 13 Javascript
原生javascript单例模式的应用实例分析
Feb 23 Javascript
关于vue的列表图片选中打钩操作
Sep 09 Javascript
VueCli生产环境打包部署跨域失败的解决
Nov 13 Javascript
原生JS封装vue Tab切换效果
Apr 28 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实现多服务器共享SESSION数据的方法
2007/03/16 PHP
深入PHP许愿墙模块功能分析
2013/06/25 PHP
使用PHP实现Mysql读写分离
2013/06/28 PHP
在wamp集成环境下升级php版本(实现方法)
2013/07/01 PHP
PHP7 整型处理机制修改
2021/03/09 PHP
如何用javascript判断录入的日期是否合法
2007/01/08 Javascript
鼠标经过显示二级菜单js特效
2013/08/13 Javascript
JavaScript中如何通过arguments对象实现对象的重载
2014/05/12 Javascript
Javascript 是你的高阶函数(高级应用)
2015/06/15 Javascript
JavaScript的面向对象编程基础
2015/08/13 Javascript
基于JavaScript获取鼠标位置的各种方法
2015/12/16 Javascript
javascript如何定义对象数组
2016/06/07 Javascript
AngularJS中的API(接口)简单实现
2016/07/28 Javascript
jquery实现全选、不选、反选的两种方法
2016/09/06 Javascript
微信小程序 本地数据读取实例
2017/04/27 Javascript
JavaScript继承定义与用法实践分析
2018/05/28 Javascript
iconfont的三种使用方式详解
2018/08/05 Javascript
js for终止循环 跳出多层循环
2018/10/04 Javascript
深入理解vue中的slot与slot-scope
2019/04/22 Javascript
基于javascript实现碰撞检测
2020/03/12 Javascript
在python中利用numpy求解多项式以及多项式拟合的方法
2019/07/03 Python
基于python的Paxos算法实现
2019/07/03 Python
Python3 socket即时通讯脚本实现代码实例(threading多线程)
2020/06/01 Python
python 使用elasticsearch 实现翻页的三种方式
2020/07/31 Python
python爬取youtube视频的示例代码
2021/03/03 Python
CSS3实现背景透明文字不透明的示例代码
2018/06/25 HTML / CSS
html5 web本地存储将取代我们的cookie
2012/12/26 HTML / CSS
HTML5实现锚点时请使用id取代name
2013/09/06 HTML / CSS
师范应届生语文教师求职信
2013/10/29 职场文书
毕业自我评价范文
2013/11/17 职场文书
美术指导助理求职信
2014/04/20 职场文书
护士长竞聘演讲稿
2014/04/30 职场文书
开国大典观后感
2015/06/04 职场文书
离婚起诉书范文2016
2015/11/26 职场文书
《绝招》教学反思
2016/02/20 职场文书
Python 统计序列中元素的出现频度
2022/04/26 Python