让div层随鼠标移动的实现代码 ie ff

 更新时间:2009年12月18日 01:59:13   作者:  
随鼠标移动的div层使用ie ff ,大家可以注意下兼容性的问题。
.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.jb51.net/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;

相关文章

  • 原生js实现简易抽奖系统

    原生js实现简易抽奖系统

    这篇文章主要为大家详细介绍了原生js实现简易抽奖系统,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • js,jq,css多方面实现简易下拉菜单功能

    js,jq,css多方面实现简易下拉菜单功能

    这篇文章主要介绍了js,jq,css多方面实现简易下拉菜单功能,需要的朋友可以参考下
    2017-05-05
  • JS动态增删表格行的方法

    JS动态增删表格行的方法

    这篇文章主要介绍了JS动态增删表格行的方法,涉及JavaScript针对表格元素动态操作相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2016-03-03
  • JavaScript实现左右滚动电影画布

    JavaScript实现左右滚动电影画布

    这篇文章主要为大家详细介绍了JavaScript实现左右滚动电影画布,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-02-02
  • js简单实现Select互换数据的方法

    js简单实现Select互换数据的方法

    这篇文章主要介绍了js简单实现Select互换数据的方法,涉及javascript动态操作select中option节点的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-08-08
  • 使用Javascript开发sliding-nav带滑动条效果的导航插件

    使用Javascript开发sliding-nav带滑动条效果的导航插件

    这篇文章主要介绍了使用Javascript开发sliding-nav带滑动条效果的导航插件,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-03-03
  • 将查询条件的input、select清空

    将查询条件的input、select清空

    查询条件清空将input、select的值清空,下面有个不错的示例,需要的朋友可以了解下
    2014-01-01
  • http头部字段Origin和Access-Control-Allow-Origin解决请求跨域

    http头部字段Origin和Access-Control-Allow-Origin解决请求跨域

    这篇文章主要为大家介绍了http头部字段Origin和Access-Control-Allow-Origin解决请求跨域示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-06-06
  • javaScript中FormData使用方法示例

    javaScript中FormData使用方法示例

    这篇文章主要为大家介绍了javaScript中FormData使用方法示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-09-09
  • 使用JavaScript实现二值化图像

    使用JavaScript实现二值化图像

    这篇文章主要为大家详细介绍了使用JavaScript将图像转换为黑白二值图的两种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-01-01

最新评论