提示标签：

<body>

<div class="container">

    <div class="row">

        <div class="col-lg-6">

            <p>

                <a href="#" class="tool" data-toggle="tooltip" data-placement="top" title="用来开发网站的">java</a>

                一种语言

            </p>

            <p>

                <a href="#" class="tool" data-toggle="tooltip" data-placement="bottom" title="用来开发网站的">java</a>

                一种语言

            </p>

        </div>

        <div class="col-lg-6">

            <p>

                <a href="#" class="tool" data-toggle="tooltip" data-placement="left" title="用来开发网站的">java</a>

                一种语言

            </p>

            <p>

                <a href="#" class="tool" data-toggle="tooltip" data-placement="right" title="用来开发网站的">java</a>

                一种语言

            </p>

        </div>

    </div>

</div>

<script type="text/javascript" src="jquery/jquery.min.js"></script>

<script type="text/javascript" src="bootstrap/bootstrap.min.js"></script>

<script type="text/javascript">

    //$('.tool').tooltip();

    $('.tool').tooltip('show');    

    $('.tool').on('hidden.bs.tooltip', function () {

          alert('隐藏了');

    })

</script>

</body>

效果：

提示框：

<body>

<div class="container">

    <div class="row">

        <!--这边用的hover触发的-->

        <button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?" data-delay='{"show": 1000, "hide": 1000 }' data-trigger="hover">Click to toggle popover</button>

    </div>

</div>

<script type="text/javascript" src="jquery/jquery.min.js"></script>

<script type="text/javascript" src="bootstrap/bootstrap.min.js"></script>

<script type="text/javascript">

$(function(){

    $('.btn').popover('show');

})

</script>

</body>

效果：

bootstrap-提示标签、提示框的更多相关文章

  1. Bootstrap：弹出框和提示框效果以及代码展示

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...

  2. JS组件Bootstrap实现弹出框和提示框效果代码

    这篇文章主要介绍了JS组件Bootstrap实现弹出框和提示框效果代码,对弹出框和提示框感兴趣的小伙伴们可以参考一下 前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编 ...

  3. Bootstrap实现弹出框和提示框效果代码

    一.Bootstrap弹出框使用过JQuery UI应该知道,它里面有一个dialog的弹出框组件,功能也很丰富.与jQuery UI的dialog类似,Bootstrap里面也内置了弹出框组件.打开 ...

  4. 四种常见的提示弹出框（success，warning，error，loading）原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  5. Highcharts Pie 饼图提示标签IE下重叠解决方法，及json数据绑定方法

    一.提示标签重叠解决方法: series: [{ startAngle:90,//添加这个属性,就可以解决 type: 'pie', name: '充值方式' }] 不知道为什么,上述方法不行了.第一 ...

  6. 关于eclipse使用thymeleaf时，提示标签不显示及后续问题的解方法

    因为thymeleaf 使用快捷键提示,不提示标签信息. 在使用网上说的的install new software安装插件的时候 报错: Unable to read repository at ht ...

  7. BarTender中每个标签提示手动输入的设置方法

    我们知道手动输入数据进行标签打印,可以利用BarTender中的数据输入表单来实现.表单的创建有利于提示程序员,输入要打印标签的的数据.如果手动输入数据的标签较多,可以设置表单提示为每个标签提示,减去 ...

  8. textarea标签提示录入剩余字数

    textarea标签提示录入剩余字数 <textarea onkeydown="checkMaxInput(this,300)" onkeyup="checkMax ...

  9. JSTL标签提示："items" does not support runtime expressions

    今天在使用JSTL的 c:forEach 标签时,jsp提示:"items" does not support runtime expressions,后来才发现是因为taglib ...

  10. bootstrap基本标签总结2

    [布局]bootstrap基本标签总结2   缩略图 <div class="container"> <div class="row"> ...

随机推荐

  1. 最近开发的ECG项目

    最近参与公司开发了一款读取ECG心电接口程序 原理就是通过心电设备读取患者的心电数据 并生成ECG文件 然后通过ECG客户端程序读取ECG文件 并解析转换成图片 上传至服务器 下边是客户端程序截图 客 ...

  2. MySQL, 创建一个只读用户和一个所有权限用户

    安装pasa需要配置mysql.基本知识学习一下 http://www.cnblogs.com/mr-wid/archive/2013/05/09/3068229.html MySQL 为关系型数据库 ...

  3. HTC One M7简易刷Recovery教程

          HTC One M7作为当下HTC旗下的旗舰热门机,用户们对于刷机的需求都比较强烈,对于刷ROM的前提就是要刷入Recovery,当然作为安卓智能手机HTC one而言也不例外,最近有些用 ...

  4. Android Sqlite数据库加密

    Android使用的是开源的SQLite数据库,数据库本身没有加密,加密思路通常有两个: 1. 对几个关键的字段使用加密算法,再存入数据库 2. 对整个数据库进行加密 SQLite数据库加密工具: 收 ...

  5. 自定义响应结构 Json格式转换 工具类

    import java.util.List; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterx ...

  6. nwjs 配置文件package.json 转载

    配置文件package.json nw在启动应用程序时,首先要读取package.json文件,初始化基本属性,下面我们看看package.json的完整参数.每个参数配置都标有注释. { /**指定 ...

  7. 开发adobe ane分享

    最近的项目使用adobe air开发,不可能避免的要使用到ane,项目初期的时候,使用了网上搜索到的了一些开源ane,最后发现,很多都不完善,要么版本太久,要么BUG很多,无人维护,所以下决心自己开发 ...

  8. SQL 查询两个字段相同表的不同记录

    select b.NativeName from sanleiDB.dbo.Dictionary_Native b where not EXISTS (select a.NativeName from ...

  9. 第一个Struts2程序之HelloWorld

    1.Struts2 简介 Struts 2是Struts的下一代产品,是在 struts 1和WebWork的技术基础上进行了合并的全新的Struts 2框架.其全新的Struts 2的体系结构与St ...

  10. ueditor调用其中的附件上传功能

    ueditor实际上是集成了webuploader, 在做内容发布的时候想既有ueditor又有单独的附件上传按钮,这时再加载一个webuploader就显得过于臃肿了,单独利用ueditor的上传功 ...