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 鼠标悬停显示的更多相关文章

  1. Bootstrap学习笔记(5)--实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单

    实现Bootstrap导航条可点击和鼠标悬停显示下拉菜单 微笑的鱼 2014-01-03 Bootstrap 5,281 次围观 11条评论 使用Bootstrap导航条组件时,如果你的导航条带有下拉 ...

  2. 鼠标悬停显示CSS3动画边框

    效果体验:http://keleyi.com/keleyi/phtml/css3/14.htm 以下是代码: <!DOCTYPE html> <html xmlns="ht ...

  3. Android Studio鼠标悬停显示注释

    Android Studio鼠标悬停显示注释 在AS中配置 如果你想从网上查看注释,到这一步就操作完成. 下面说明让软件使用本地注释: 使用本地注释 以Windows为例: 找到下面文件 C:\Use ...

  4. EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码

    EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...

  5. EasyUI的Datagrid鼠标悬停显示单元格内容

    功能描述:table鼠标悬停显示单元格内容 1.js函数 function hoveringShow(value) { return "<span title='" + va ...

  6. jQuery实现鼠标悬停显示提示信息窗口的方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 可以兼容ie6的纯CSS三级鼠标悬停显示/隐藏菜单实现

    本来在chrome上用js写的好好的三级显隐菜单,放到ie6上一测试竟然奇葩般的会瞎闪.问题原因至今没参透,可能是我每次响应事件的处理代码过长??总之我是对ie6幻灭了,去网上搜一搜能支持ie6的下拉 ...

  8. jQuery鼠标悬停显示提示信息窗体

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. CSS或者JS实现鼠标悬停显示另一元素

    想达到鼠标悬停到元素a上,显示另一个元素b,可以通过css实现也可以通过js实现.js:写两个函数:mouseenter,mouseleave,例如:其中 $("#a").mous ...

随机推荐

  1. python2/python3 内存中打包/压缩文件

    python2:(包含压缩选项,如果只打包,可以调整zipfile.ZIP_DEFLATED) import zipfile import StringIO class InMemoryZip(obj ...

  2. temp-内外网同时上的例子

    @echo off rem //不少公司的网管试图解决双网卡问题,下面我就给大家详细的讲解一下双网卡同时使用的方法,这样即可保障内网的安全,又能解决电脑访问外网的问题,一举两得.希望大家喜欢.rem ...

  3. Oracle日期时间操作大全

    本文出自:http://www.cnblogs.com/hl3292/archive/2010/11/03/1868159.html oracle sql日期比较: 共三部分: 第一部分:oracle ...

  4. java自然语言理解demo,源码分享(基于欧拉蜜)

    汇率换算自然语言理解功能JAVA DEMO >>>>>>>>>>>>>>>>>>>&g ...

  5. 如何在mybatis 中使用In操作

    如何在mybatis 中使用In操作 假如我们想使用这样一个sql 语句,但是这样的sql语句有IN这样的操作.在我们的mybatis中有相对应的操作 SELECT * FROM product_db ...

  6. eclipse配置maven + 创建maven项目(三)

    上篇博文中我们介绍了maven下载.安装和配置(二),这篇博文我们配置一下eclipse,将它和maven结合,并我们创建一个maven的项目. 准备工作 在eclipse配置maven之前需要我们做 ...

  7. java基本类型与Hadoop常见基本类型的对照

    Long LongWritable Integer IntWritable Boolean BooleanWritable String Text 1.java类型转化为hadoop基本类型 调用ha ...

  8. Cheat sheet for Jupyter Notebook

    近期,DataCamp发布了jupyter notebook的 cheat sheet,[Python数据之道]第一时间与大家一起来分享下该cheat sheet的内容. 以下是该cheat shee ...

  9. JAVA多线程---wait() & join()

    题外话: interrupt()方法  并不能中断一个正常运行的线程!!! class myThread extends Thread{ @Override public void run(){ fo ...

  10. Hadoop 2:Mapper和Reduce

    Hadoop 2:Mapper和Reduce Understanding and Practicing Hadoop Mapper and Reduce 1 Mapper过程 Hadoop将输入数据划 ...