bootstrap 鼠标悬停显示
1、
<button type="button" rel="drevil" data-content="报名截止时间:'+time+'" data-container="body" data-toggle="popover" data-placement="bottom"></button>
2、
$(function () { $("[data-toggle='popover']").popover(); });
$("[rel=drevil]").popover({
trigger:'manual',
//placement : 'bottom', //placement of the popover. also can use top, bottom, left or right
//天title : '<div style="text-align:center; color:red; text-decoration:underline; font-size:14px;"> Muah ha ha</div>', //this is the top title bar of the popover. add some basic css
html: 'true', //needed to show html of course
//content : '<div id="popOverBox"><img src="http://www.hd-report.com/wp-content/uploads/2008/08/mr-evil.jpg" width="251" height="201" /></div>', //this is the content of the html box. add the image here or anything you want really.
animation: false
}).on("mouseenter", function () {
var _this = this;
$(this).popover("show");
$(this).siblings(".popover").on("mouseleave", function () {
$(_this).popover('hide');
});
}).on("mouseleave", function () {
var _this = this;
setTimeout(function () {
if (!$(".popover:hover").length) {
$(_this).popover("hide")
}
}, );
});
bootstrap 鼠标悬停显示的更多相关文章
- Bootstrap学习笔记(5)--实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单
实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单 微笑的鱼 2014-01-03 Bootstrap 5,281 次围观 11条评论 使用Bootstrap导航条组件时,如果你的导航条带有下拉 ...
- 鼠标悬停显示CSS3动画边框
效果体验:http://keleyi.com/keleyi/phtml/css3/14.htm 以下是代码: <!DOCTYPE html> <html xmlns="ht ...
- Android Studio鼠标悬停显示注释
Android Studio鼠标悬停显示注释 在AS中配置 如果你想从网上查看注释,到这一步就操作完成. 下面说明让软件使用本地注释: 使用本地注释 以Windows为例: 找到下面文件 C:\Use ...
- EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码
EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...
- EasyUI的Datagrid鼠标悬停显示单元格内容
功能描述:table鼠标悬停显示单元格内容 1.js函数 function hoveringShow(value) { return "<span title='" + va ...
- jQuery实现鼠标悬停显示提示信息窗口的方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 可以兼容ie6的纯CSS三级鼠标悬停显示/隐藏菜单实现
本来在chrome上用js写的好好的三级显隐菜单,放到ie6上一测试竟然奇葩般的会瞎闪.问题原因至今没参透,可能是我每次响应事件的处理代码过长??总之我是对ie6幻灭了,去网上搜一搜能支持ie6的下拉 ...
- jQuery鼠标悬停显示提示信息窗体
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS或者JS实现鼠标悬停显示另一元素
想达到鼠标悬停到元素a上,显示另一个元素b,可以通过css实现也可以通过js实现.js:写两个函数:mouseenter,mouseleave,例如:其中 $("#a").mous ...
随机推荐
- 201521123102 《Java程序设计》第12周学习总结
1.本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2.书面作业 将Student对象(属性:int id, String name,int age,double ...
- 如何快速生成企业Web应用
随着互联网的发展,企业认识到"电子化"和"无纸化"办公是一种必然趋势,但是企业在信息化建设中经常望而却步,主要原因是高昂的建设成本与不可以预估的结果风险.另外软 ...
- Apache Spark 2.2.0 中文文档 - 快速入门 | ApacheCN
快速入门 使用 Spark Shell 进行交互式分析 基础 Dataset 上的更多操作 缓存 独立的应用 快速跳转 本教程提供了如何使用 Spark 的快速入门介绍.首先通过运行 Spark 交互 ...
- MySQL的一点浅显知识
本人最近看了一本有关于MySQL的书籍<MySQL必知必会>,书中只写了一些基本知识,但是也基本涵盖了所有的MySQL的知识点.其余的比较高级的也只是在基础上进行扩展或者是优化,看完这本书 ...
- Ubuntu17.04安装wps
1.进入http://community.wps.cn/download/下载wps-office安装包,我下载的是dep的包. 2.进行安装执行命令:sudo dpkg -i wps-office_ ...
- java GUI编程二
java基础学习总结--GUI编程(二) 一.事件监听 测试代码一: 1 package cn.javastudy.summary; 2 3 import java.awt.*; 4 import j ...
- MongDB开启权限认证
在生产环境中MongoDB已经使用有一段时间了,但对于MongoDB的数据存储一直没有使用到权限访问(MongoDB默认设置为无权限访问限制),最近在酷壳网看了一篇技术文章(https://cools ...
- 第一个ExtJS练习(添加用户面板)
1.[准备] 我是在visual studio里面建立了一个asp.net MVC项目,然后导入ExtJS必要的包,然后写的. ExtJS5.1版本下载:https://pan.baidu.com/s ...
- InnoDB Undo Log
简介 Undo Log包含了一系列在一个单独的事务中会产生的所有Undo Log记录.每一个Undo Log记录包含了如何undo事务对某一行修改的必要信息.InnoDB使用Undo Log来进行事务 ...
- 1523. K-inversions URAL 求k逆序对,,,,DP加树状数组
1523. K-inversions Time limit: 1.0 secondMemory limit: 64 MB Consider a permutation a1, a2, …, an (a ...