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 ...
随机推荐
- 微信公众平台接口调用第一步(获取access_token)
最近公司需要开发微信公众号,闲着无聊就写写博客,希望能帮到你我 上代码: package test; import java.util.List; import java.util.ArrayList ...
- ★浅谈Spanking情节
- 201521123121 《JAVA程序设计》第7周学习总结
1. 本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 参考资料: XMind 2. 书面作业 ArrayList代码分析 1.1 解释ArrayList的contains源代码 ...
- 201521123055 《Java程序设计》第11周学习总结
1. 本章学习总结 2. 书面作业 Q1.互斥访问与同步访问 ** 完成题集4-4(互斥访问)与4-5(同步访问) ** 1.1 除了使用synchronized修饰方法实现互斥同步访问,还有什么办法 ...
- 201521123050 《Java程序设计》第13周学习总结
1. 本周学习总结 2. 书面作业 1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu.edu.cn,分析返回结果有何不同?为什么会有这样的不同? 对比可以看出 ...
- 解决vsftp无法启动问题(转)
[root@node11 ~]# service vsftpd restartShutting down vsftpd: [F ...
- Git仓库创建和文件提交
参考质料:廖雪峰的个人网站 Git 什么是Git:一个分布式版本管理系统: 作用:管理你的历史文件,文件修改历史,团队协作. Windows下安装Git: 到链接下载安装包,国内镜像 云盘 安装完成后 ...
- 【轉】使用jQuery播放/暂停 HTML5视频
jQuery不可以使用play()方法,但js是可以的: document.getElementById('movie1').play(); 解决方法:play并不是jQuery的函数,而是DOM ...
- PuTsangTo-单撸游戏开发02 测试场景与单轴移动
且不说立项与设计阶段的工作量,一个完整的游戏在开发阶段设计的职责范围也是很广,还有个大问题就是PuTsangTo项目也是本人在边学边做,截止目前还是满满的无从下手的感觉,一方面是技能与经验不足,另一方 ...
- Ensemble Learning: Bootstrap aggregating (Bagging) & Boosting & Stacked generalization (Stacking)
Booststrap aggregating (有些地方译作:引导聚集),也就是通常为大家所熟知的bagging.在维基上被定义为一种提升机器学习算法稳定性和准确性的元算法,常用于统计分类和回归中. ...