`
康敏栋
  • 浏览: 171382 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

鼠标移动显示层

阅读更多
转自csdn中一个朋友的回答答案http://bbs.csdn.net/topics/310199485

当鼠标移动，显示出层，离开，层隐藏，直接将以下代码另存为html即可查看效果 







<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script>
function over(obj,div,bol){
var rec=getoffset(obj);
    div.style.top=rec[0]+obj.offsetHeight;
    if(bol==true)
    	rec[1] -= 50;
    div.style.left=rec[1];     
    div.style.display="block";        
}
    
function out(div) {
div.style.display="none";
}

function getoffset(e) {  
var t=e.offsetTop;  
 	var l=e.offsetLeft;  
 	while(e=e.offsetParent) {  
  	 t+=e.offsetTop;  
  	 l+=e.offsetLeft;  
 	}  
var rec = new Array(1); 
 	rec[0]  = t; 
 	rec[1] = l; 
 	return rec 
}  

</script>
<BODY>
<table>
<tr>
<td height="29" colspan="2" align="left" class="STYLE1">
<span class="STYLE5"><a href="javascript:void(0)" onmouseover="over(this,td0)" onmouseout="timer=setTimeout('out(td0)',0)">健康教育的重要性（详解)</a></span>
</td>
</tr>
<tr>
<div id="td0" align=left class="STYLE4" onmouseover="clearTimeout(timer);this.style.display='block'" onmouseout="out(this)" style=" font-size: 14px;background-color:#dee4eb; display:none; width:330px; position:absolute; padding:10px;">  
1、因为您对患者提供的合理教育可能有助于减少因处理不当而引起的被投诉的风险；<br/>
2、教育能够加强糖尿病并发症的预防和早期发现；<br/>
3、教育能够最大程度的提高患者的依从性，否则如果患者不能够遵守治疗的各个环节，您将很难评价您推荐的治疗方案是否有效。

    </div>
</tr>
</table>
</BODY>
</HTML>
  • 大小: 28.9 KB
  • 大小: 50.4 KB
分享到：
| webservice客户端不生成JAXBElement类型
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    鼠标移动DataGrid显示详细信息

    根据提供的标题、描述、标签及部分内容，我们可以了解到这篇文章主要讲述的是如何实现在鼠标移动到 DataGrid 的某一行时，显示出该行的详细信息。DataGrid 是一种常用的 Web 控件，用于展示表格形式的数据。下面我们...

    鼠标移动或划过文字弹出层

    鼠标移动弹出层 鼠标移动弹出层 鼠标移动弹出层 鼠标移动弹出层

    javascript实现鼠标移动弹出层的显示与隐藏

    当鼠标指向某一个连接或标签时，就会显示相应的详细信息，鼠标移开时，信息就消失

    jquery 弹出层跟随鼠标移动

    "jquery 弹出层跟随鼠标移动"这一主题涉及到jQuery的事件监听、动态创建元素以及CSS定位技术。下面将详细讲解这些知识点。 1. **jQuery 事件监听**： jQuery 提供了方便的事件绑定方法，如 `.on()`，用于监听用户...

    鼠标移动选项层切换实例

    现在各大门户都提供了鼠标移到某个按钮上就显示显示某个层的内容。比如新闻组中（浙江，广东，上海，北京）四个选项，当移动到浙江下边就弹出浙江相关的新闻的特效

    鼠标滑过显示层，随坐标移动

    鼠标滑过显示层，随坐标移动

    html5 css3图文内容全屏层叠移动鼠标切换显示代码

    在这个项目中，CSS3的`transition`和`transform`属性可能被用来实现鼠标移动时内容的平滑切换。`transition`定义了元素从一种样式变换到另一种样式的速度，而`transform`则可以用来改变元素的位置、大小和形状。通过...

    jQuery鼠标移动图片遮罩显示特效.zip

    在这个"jQuery鼠标移动图片遮罩显示特效.zip"压缩包中，包含了一个利用jQuery实现的独特图片展示功能，特别适用于图片相册或者产品展示等场景。接下来，我们将深入探讨这个特效背后的技术细节。 首先，jQuery的事件...

    鼠标移动到地图某个对象时，放大突出显示

    "鼠标移动到地图某个对象时，放大突出显示"这一功能是地图应用中的常见交互模式，它增强了用户的地图探索能力。在这个场景中，当用户将鼠标指针移动到地图上的特定对象（如点、线、面或者图层）附近，对象的图标会...

    二级菜单,鼠标指向显示隐藏层

    大家看好了说明，再下载，别浪费了自己的资源分。...二级导航菜单、鼠标移动显示当前层内容，有的网站首页用此功能。 强烈抗意某用户。要的资源分高却不给功能。 所以小弟发布此功能。他要10分，我只需5分。

    jQuery Tooltip 随鼠标移动的层

    它能够根据鼠标的移动展示相关信息，提升用户体验，特别是在处理大量数据或需要解释特定元素时非常有用。这个工具主要依赖于jQuery库，因此在使用前需要确保页面已经引入了jQuery。 在jQuery Tooltip中，我们可以...

    html5 css3图文内容全屏层叠移动鼠标切换显示代码.zip

    代码片段： Edge.prototype.swap = function() { var e0 = this.oPrev(), e1 = this.sym().oPrev(); this.splice(e0); this.sym().splice(e1); this.splice(e0.lNext()); this.sym().splice(e1.lNext...

    完美的鼠标放上去jquery显示隐藏层

    当鼠标移动到特定元素（如图片、文字）上时，jQuery会监听到hover事件，并执行预设的函数来改变目标隐藏层的CSS属性，例如将其display属性从none切换为block，从而实现显示；鼠标离开时，再将display属性恢复为none...

    js鼠标滑过图片，在图片上方蒙上一层透明层显示详情内容

    以上代码中，`mouseover`事件会在鼠标移动到图片上时触发，而`mouseout`事件则在鼠标移出图片时触发。通过改变透明层的`opacity`属性，我们可以控制其可见性，从而实现滑过图片显示详情内容的效果。 此外，如果你的...

    OpenLayers3实现鼠标移动显示坐标

    本篇知识点着重介绍在OpenLayers3中，如何实现鼠标移动显示坐标的功能，包括实现的基本思路和具体代码示例。 ### 实现思路： 1. **加载地图瓦片图层**：首先，需要加载一个基础的地图瓦片图层，常用的是OSM（Open...

    鼠标移动到图片出来半透明文字层.rar

    "鼠标移动到图片出来半透明文字层"这个主题，就是一种常见的网页交互设计技术，它通过JavaScript或者CSS3来实现。下面我们将深入探讨这个知识点。 首先，我们要了解这个效果的基本原理。当用户将鼠标光标移动到图片...

    js鼠标浮动显示div

    在本案例中，"js鼠标浮动显示div"指的是当鼠标移动到特定的input元素上时，会显示出一个div层，该div层中包含有与input相关的附加信息或者功能。 首先，我们需要了解几个关键的概念： 1. **事件监听器**：...

    CSS3实现鼠标移动到DIV上高亮显示特效

    本示例中，我们将探讨如何利用CSS3来实现一个动态特效：当鼠标悬停在DIV元素上时，特定部分高亮显示，而其余部分则变灰暗。这个效果可以增强用户界面的互动性和吸引力，帮助用户更好地聚焦于关键信息。 首先，我们...

    jQuery弹出层 可移动层 提示框 浮动层

    在标题提及的案例中，"jQuery弹出层 可移动层 提示框 浮动层"，意味着我们需要创建一个不仅可以显示信息，还可以通过用户手势移动的浮动窗口。为了实现这一功能，我们需要结合jQuery的选择器、事件处理和动画方法。...

    网页效果鼠标移动上出现覆盖层

    在网页设计中，"鼠标移动上出现覆盖层"是一种常见的交互效果，用于增强用户体验和提供更多信息。这种效果通常结合JavaScript（js）和层叠样式表（CSS）来实现。下面我们将详细探讨如何利用这两种技术创建这样的功能...

Magicbox
Global site tag (gtag.js) - Google Analytics