提示标签：

<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. Photoshop的评价

    Photoshop是Adobe公司旗下最为出名的图像处理软件之一. Photoshop的功能性:主要处理以像素所构成的数字图象.使用其众多的编修与绘图工具,可以有效地进行图片编辑工作.支持Window ...

  2. “添加到收藏夹”功能（share）

    以下分享自: 如何给网站增加“添加到收藏夹” 给网站添加“添加到收藏夹”理论上应该是很简单的事情,但是受到各种浏览器和操作系统的不一致的问题,使得这个问题异常的繁琐啊. 下面是梳理的一些资料,仅供参考 ...

  3. 写给笨蛋徒弟的学习手册（1）——完整C#项目中各个文件含义

    Bin 目录用来存放编译的结果,bin是二进制binrary的英文缩写,因为最初C编译的程序文件都是二进制文件,它有Debug和Release两个版本,分别对应的文件夹为bin/Debug和bin/R ...

  4. Android下载更新代码

    其实是昨天反编译一个apk,给它添加一个自动更新的功能用到的.为了在smali下方便查看,代码写的不规范,反正到了smali都一个吊样~~~~ 权限: <uses-permission andr ...

  5. cocoapods:安装/更新Ruby环境教程

    简介 有时候在安装cocoapods时会产生如下错误 ERROR: Error installing cocoapods: activesupport requires Ruby version &g ...

  6. JDBC修改表数据

    修改数据时用到update语句,使用这个语句时也要有条件的,指定修改某一行的数据,没有条件判断,则修改全部. package qddx.JDBC; import java.sql.*; public ...

  7. codeforces A. Difference Row

    link:http://codeforces.com/contest/347/problem/A 开始看起来很复杂的样子,但是刚写下样例,就发现因为中间的都消去了,其实起作用的就是最大值和最小值=_= ...

  8. java内存图解

      最近突然对java的内存管理来了兴趣想,之前对java内存很模糊,通过这几天的学习现在将学习成果记录下来欢迎大家多多指教,为了方便我自己画了一个图

  9. js中遍历对象的属性和值

    今天想看一下js的数组遍历的内容,搜索到了一个关于对象遍历写好的函数,保留一下.以后好用. function allPrpos ( obj ) {   // 用来保存所有的属性名称和值   var p ...

  10. 【以前弄的老东西】DLLspy超犀利后门 （源代码+程序+使用手册+二次开发文档）

    这个玩意儿是很久之前的整的.一直没有做完,但是基本功能和框架都做好了,现在发出来,希望有能力的家伙一起完成.DLLspy,绝对免杀,隐藏,HTTP请求劫持,居家旅行,杀人放火必备良药.有时间我会继续开 ...