Jquery实现鼠标移到某个对象,弹出显示层。
/**
* 鼠标移上去显示层
* @param divId 显示的层ID
* @returns
*/
$.fn.myHoverTip = function(divId) {
var div = $("#" + divId); //要浮动在这个元素旁边的层
div.css("position", "absolute");//让这个层可以绝对定位
var self = $(this); //当前对象
self.hover(function() {
div.css("display", "block");
var p = self.position(); //获取这个元素的left和top
var x = p.left + self.width();//获取这个浮动层的left
var docWidth = $(document).width();//获取网页的宽
if (x > docWidth - div.width() - 20) {
x = p.left - div.width();
}
div.css("left", x);
div.css("top", p.top);
div.show();
},
function() {
div.css("display", "none");
}
);
return this;
}
在哪个对象旁边显示DIV,随自己定义,只要定义一个ID即可:
如: <a id="viewReInfo" href="#" >查看收件人回执情况</a> 需要显示的DIV,根据需求自己定义,同样只需定义ID即可: 如:<div id="receiptInfo" class="receiptInfo"></div> 调用上面的JS函数,代码如下: $('#viewReInfo').myHoverTip('receiptInfo');

Jquery实现鼠标移到某个对象,弹出显示层。的更多相关文章
- JS事件 鼠标移开事件(onmouseout)鼠标移开事件,当鼠标移开当前对象时,执行onmouseout调用的程序。
		
鼠标移开事件(onmouseout) 鼠标移开事件,当鼠标移开当前对象时,执行onmouseout调用的程序. 当把鼠标移动到"登录"按钮上,然后再移开时,触发onmouseout ...
 - Windows Shell编程之如何编写为文件对象弹出信息框的Shell扩展
		
有关COM编程资料 转载:http://www.cnblogs.com/lzjsky/archive/2010/11/22/1884702.html 活动桌面引入一项新特性, 当你在某些特定对象上旋停 ...
 - 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间
		
原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...
 - JQuery弹出层,点击按钮后弹出遮罩层,有关闭按钮
		
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...
 - VC/MFC 当鼠标移到控件上时显示提示信息
		
VC/MFC 当鼠标移到控件上时显示提示信息 ToolTip是Win32中一个通用控件,MFC中为其生成了一个类CToolTipCtrl,总的说来其使用方法是较简单的,下面讲一下它的一般用法和高级用法 ...
 - JQuery弹出层,点击按钮后弹出遮罩层,有关闭按钮【转】
		
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <t ...
 - lightinthebox头部分类菜单下拉导航,使鼠标移到See All Categories就显示下拉菜单
		
lightinthebox头部分类菜单下拉导航,使鼠标移到See All Categories就显示下拉菜单 打开includes\templates\lightinthebox\common\tpl ...
 - jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
		
本文实例讲述了jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能.分享给大家供大家参考,具体如下: 弹出层:两种方式 一是打开网页就自动弹出层二是点击弹出 <!DOCTYPE html ...
 - jquery特效(7)—弹出遮罩层且内容居中
		
上周写了几个小特效,其中有个点击按钮弹出遮罩层的特效,下面来看最终实现的效果: 由于是测试的程序,所以我未加关闭的按钮. 一.主体程序 <!DOCTYPE html> <html&g ...
 
随机推荐
- JavaScript学习日志(四):BOM
			
BOM的核心对象就是window,这一章没什么好说的,总结一些比较常用的: 1,a未定义,a; //报错window.a; //undefined 不能用delete删除全局变量 2,html5不支持 ...
 - mpls vpn剩余笔记
			
将IP地址映射为简单的具有固定长度的标签 用于快速数据包交换 20 3 1 8 在整个转发过程中,交换节点仅根据标记进行转发 标签交换路径(LSP) 多协议标签交换MPLS最初是为了提高转发速度而提出 ...
 - 个人作业2——英语学习APP案例分析(必应词典的使用)
			
第一部分 调研, 评测 1.使用环境:window 10 词典版本: 2.使用体验: 打开词典出现下面这一界面: 词典模块:出现了每日一词,每日一句,每日阅读板块,还提供了生词本,个人觉得最喜欢的是这 ...
 - 201521123096《Java程序设计》第四周学习总结
			
1. 本周学习总结 1.1 尝试使用思维导图总结有关继承的知识点. 1.2 使用常规方法总结其他上课内容. 继承能够动态绑定,运行时能够自动的选择调用方法,十分方便. 2. 书面作业 (1)注释的应用 ...
 - Servlet第五篇【介绍会话技术、Cookie的API、详解、应用】
			
什么是会话技术 基本概念: 指用户开一个浏览器,访问一个网站,只要不关闭该浏览器,不管该用户点击多少个超链接,访问多少资源,直到用户关闭浏览器,整个这个过程我们称为一次会话. 为什么我们要使用会话技术 ...
 - Java Map对象的遍历
			
一般情况下Map的实现类中用的最多的是 HashMap . Map的遍历也就是迭代 1. 在for-each循环中使用entries来遍历 (既要取键,又要取值) Map<String, St ...
 - editplus的设置
			
1, 下载editplus3软件并且进行安装, 我这里是 EditPlus_3.4.1.1123_XiaZaiBa 2, 进行相关设置: 工具-->参数设置-->常规--勾选 (把Edit ...
 - 升级Linux tar &&解决某用tar解压失败的tar包
			
今天解压个文件,出来很多这样的: /bin/tar: Ignoring unknown extended header keyword `SCHILY.dev'/bin/tar: Ignoring u ...
 - centOS 6 服务管理与服务脚本
			
服务管理与服务脚本 linux服务 服务管理与服务脚本 linux服务 服务启动过程详解 chkconfig命令 非独立服务与xinetd进程 一个特殊的服务脚本 服务启动过程详解 在开机启动 ...
 - Spring c3p0连接池无法释放解决方案
			
通过c3p0配置连接池的时候,在进行压力测试的时候,日志出现了这样一个错误:Data source rejected establishment of connection, message from ...