`
907182878
  • 浏览: 7714 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

用js让透明的div跟着鼠标移动,兼容火狐和IE

阅读更多

废话不多说,代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

<body>
sfsdfsfsfsfsfsd<a id="item" href="#" onmouseout="move2(this)" onmousemove="move1(this)">给我出来,出来,出来</a> sfdsfsfsfsfsfsfdfs<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您能看见我吗?
<br>
<div id="f" style="display: none;color:blue;position:absolute;background-color: gray;filter: alpha(opacity=70); opacity: 0.7;">
	出来了出来了<br>出来了出来了<br>出来了出来了
<span id="span"></span>
</div>
</body>
<script type="text/javascript">
function mousePos(e){
	var x,y;
	var e = e||window.event;
	return {
		x:e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft, 
		y:e.clientY+document.body.scrollTop+document.documentElement.scrollTop
	}; 
}
function move1(t,e) {
	onne(e,"");
	document.getElementById("span").innerText = t.innerText;
}
function move2(t,e) {
	onne(e,"none");
}
function onne(e,v) {
	var mouse = mousePos(e);     
	var t = document.getElementById("f")
	t.style.left = mouse.x ; 
	t.style.top = mouse.y; 
	t.style.display = v; 
}
</script>
</html>

 

分享到:
评论

相关推荐

    Javascript的IE和Firefox(火狐)兼容性

    ### Javascript的IE与Firefox(火狐)兼容性解决方案 在Web开发过程中,浏览器兼容性问题一直是开发者们关注的重点之一。由于不同的浏览器对于Web标准的支持程度存在差异,这导致了同样的代码在不同浏览器中的表现...

    JS获得鼠标位置(兼容多浏览器ie,firefox)

    本文将详细讲解如何在不同的浏览器环境下,包括IE和Firefox,获取鼠标的坐标位置,并提供相应的源码示例。 首先,我们需要理解在浏览器环境中,鼠标的坐标通常有两种表示方式:页面坐标和元素坐标。页面坐标是指...

    google鼠标经过JS特效,IE/FF兼容

    标题中的"google鼠标经过JS特效,IE/FF兼容"指的是一个JavaScript实现的特效,它在鼠标悬停(mouseover)某个元素时,会触发一个特定的动画效果,即上部的图片从小到大闪动出现。这个特效适用于谷歌浏览器(Google ...

    JavaScript实现弹出层的移动 兼容IE和Firefox

    在标题"JavaScript实现弹出层的移动 兼容IE和Firefox"中,我们可以看到主要涉及的是JavaScript动态改变HTML元素位置的技术,并且这个技术已经考虑到了浏览器兼容性问题,包括Internet Explorer(IE)和Mozilla Fire...

    可拖动div层,兼容IE火狐等浏览器

    这个功能在jQuery库的支持下,可以实现跨浏览器的兼容性,包括Internet Explorer(IE)、Firefox等主流浏览器。 jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互。在这个场景中,`...

    js放大缩小拖拽图片(兼容IE、火狐)

    本文将详细介绍一个JavaScript脚本,该脚本可以实现图片的放大、缩小以及拖拽功能,并且能够兼容Internet Explorer (IE) 和 Firefox 浏览器。通过这个脚本,我们可以为用户提供更加灵活的图片浏览体验。 #### 核心...

    可通过鼠标拖动调整表格单元格宽度效果代码[兼容IE,firefox]

    总的来说,"可通过鼠标拖动调整表格单元格宽度效果代码[兼容IE,firefox]"是一个涉及到JavaScript事件处理、浏览器兼容性以及用户交互设计的实用技术,它提升了网页的用户体验,同时也体现了前端开发者对细节和用户...

    兼容IE与火狐的拖动div效果

    本文将详细讲解如何实现一个兼容IE和Firefox的拖动div效果。 首先,我们需要了解两种浏览器对拖放事件的支持情况。Internet Explorer(IE)从版本5.5开始支持DOM级别的拖放,而Firefox则从版本3.5开始支持W3C标准的...

    div随鼠标移动.html

    div随鼠标自由移动,代码简单,移动流畅,兼容ie、firefox、chrome等主流浏览器。

    js实现鼠标滑动到某个div禁止滚动

    此外,还考虑到了不同浏览器(如IE和Firefox)对事件处理的兼容性问题,并给出了相应的解决方案。 具体实现步骤如下: 1. 首先定义了一个div元素,并通过CSS对其进行了样式设置,使其能够成为目标区域。 ```css #...

    js 鼠标位置 div拖拽

    注意到标签中提到了"支持ie和firefox",这意味着代码需要考虑不同浏览器之间的差异。例如,`offsetX`和`offsetY`在旧版本的IE中可能不支持,需要使用`clientX`和`clientY`结合元素的`offsetLeft`和`offsetTop`属性...

    兼容火狐、IE、OPERA的滑动门

    这个“兼容火狐、IE、OPERA的滑动门”是一个专门为不同浏览器优化的滑动门实现,确保在Firefox、Internet Explorer和Opera这三种主流浏览器上都能正常工作。 首先,我们要理解滑动门技术的基本原理。滑动门通常由...

    BlueBala » 兼容IE和Firefox的事件模型(拖动)

    本文将深入探讨如何创建一个兼容Internet Explorer(IE)和Firefox浏览器的事件模型,特别是在实现拖动功能时所面临的挑战和解决方案。 首先,我们需要理解IE和Firefox在事件处理上的差异。在IE中,事件处理主要...

    通用可拖动层示例兼容火狐,IE

    这个"通用可拖动层示例兼容火狐,IE"就是一个针对不同浏览器,尤其是火狐(Firefox)和IE(Internet Explorer)实现的可拖动层解决方案。 首先,我们来看"可移动层示例.html",这是一个HTML文件,其中包含了用于...

    JavaScript自定义浏览器滚动条兼容IE、 火狐和chrome.docx

    使用 CSS 可以自定义浏览器滚动条的样式,但是 CSS 只能转变 Chrome 和 IE 浏览器的样式,无法对 Firefox 浏览器进行样式定义。因此,我们需要使用 JavaScript 来实现自定义浏览器滚动条。 二、JavaScript 实现...

    用JS实现和google地图类似的图片查看器-----放大、缩小、移动和还原,都控制在div里,兼容ie,FF

    这个查看器将具备放大、缩小、移动和还原图片的功能,并且能够在div容器内正常工作,同时兼容Internet Explorer(IE)和Firefox浏览器。我们将探讨以下几个关键知识点: 1. **图片加载**: 在JavaScript中,我们...

    火狐兼容获取鼠标的坐标

    标题“火狐兼容获取鼠标的坐标”涉及到的是在网页开发中如何在Firefox浏览器上获取鼠标指针的位置。在Web开发中,特别是在JavaScript编程中,获取鼠标坐标是一项常见的需求,用于实现各种交互效果,如拖放功能、点击...

    用JS实现和google地图类似的图片查看器-放大、缩小、移动和还原,都控制在div里,兼容ie,FF

    这个查看器将具备放大、缩小、移动和还原图片的功能,并且能够在浏览器的div元素内运行,同时兼容Internet Explorer(IE)和Firefox等主流浏览器。 ### 1. 基本结构与HTML布局 首先,我们需要创建一个HTML页面,...

    html+js实现可拖动,兼容IE7及以上firefox、谷歌等各版本弹出层并锁屏效果代码

    在这个项目中,我们讨论的是如何使用这两种语言来创建一个可拖动的弹出层,并实现兼容IE7及以上版本,包括Firefox和Chrome在内的多种浏览器的锁屏效果。这个功能在网页应用中很常见,比如在显示模态对话框或提示信息...

    兼容ie和firefox滑动门技术

    本资源主要关注如何使滑动门技术在Internet Explorer(IE)和Firefox等主流浏览器上兼容。 在JavaScript(JS)的帮助下,我们可以实现更强大的滑动门效果,特别是在那些对CSS支持不佳的浏览器中。以下是一些关于...

Global site tag (gtag.js) - Google Analytics