先看看效果图:【当光标放在下面这个时间搜索框上时,显示一段文字:搜索时间段中的流水信息】

这样的效果,怎么实现呢?

很简单

1.引入jQuery.js和bootstrap的js和css

2.给想要有tip提示框效果的元素添加下面后面三个属性

<input type="text" class="form-control search-menu dateInput"   data-toggle="tooltip" data-placement="top" title="搜索时间段中的流水信息">
data-toggle 标明这个元素有tips这个效果
data-placement 标明tips这个效果在本元素的什么位置显示
title  标明tips元素显示些什么文本内容

3.js中绑定一下tooltip即可

//时间搜索框--鼠标悬浮事件
$(".dateInput").tooltip();

【bootstrap】bootstrap中的tooltip的使用的更多相关文章

  1. Bootstrap 提示工具(Tooltip)插件

    一.提示工具(Tooltip)插件根据需求生成内容和标记,默认情况下是把提示工具(tooltip)放在它们的触发元素后面. 有以下两种方式添加提示工具(tooltip): 1.通过data属性:如需添 ...

  2. bootstrap Table 中给某一特定值设置table选中

    bootstrap Table 中给某一特定值设置table选中 需求: 如图所示:左边地图人员选定,右边表格相应选中. 功能代码: //表格和图标联动 function changeTableSel ...

  3. Bootstrap.css 中请求googleapis.com/css?family 备忘录

    问题描述: Web中引入bootstrap.css中头部有访问Google服务器的请求 @import url("//fonts.googleapis.com/css?family=Open ...

  4. 在Bootstrap开发框架中使用Grid++报表

    之前在随笔<在Winform开发中使用Grid++报表>介绍了在Winform环境中使用Grid++报表控件,本篇随笔介绍在Bootstrap开发框架中使用Grid++报表,也就是Web环 ...

  5. 在Bootstrap开发框架中使用dataTable直接录入表格行数据(2)--- 控件数据源绑定

    在前面随笔<在Bootstrap开发框架中使用dataTable直接录入表格行数据>中介绍了在Web页面中使用Jquery DataTable插件进行对数据直接录入操作,这种处理能够给用户 ...

  6. 在Bootstrap开发框架中使用dataTable直接录入表格行数据

    在Winform开发的时候,我们很多时候可以利用表格控件来直接录入数据,不过在Web上较少看到,其实也可以利用dataTable对象处理直接录入表格行数据,这个可以提高数据的录入方便,特别是在一些简单 ...

  7. 在Bootstrap开发框架中使用bootstrapTable表格插件和jstree树形列表插件时候,对树列表条件和查询条件的处理

    在我Boostrap框架中,很多地方需要使用bootstrapTable表格插件和jstree树形列表插件来共同构建一个比较常见的查询界面,bootstrapTable表格插件主要用来实现数据的分页和 ...

  8. 使用BootStrap框架中的轮播插件

    在使用bootstrap框架中的轮播插件时,效果做出来后,无法通过点击小圆行的按钮来选择特定的图片. 后面发现是最开始的<div>标签中少写了一个id.一开始<div>标签是这 ...

  9. 在Bootstrap框架中,form-control的效果

    在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果. 1.宽度变成了100% 2. ...

  10. bootstrap -- meta中的viewport指令

    在查看bootstrap教程中,碰到 <meta name="viewport" content="width=device-width, initial-scal ...

随机推荐

  1. kettle-单表增量同步

    目标:利于kettle实现单表增量同步,以时间为判断条件 背景:源表:db1.q1 (2w条数据) 目标表:db2.q2(0条数据) 表结构: CREATE TABLE `q1` (  `ID` bi ...

  2. filter 作用

     过滤器 filter用于拦截用户请求,在服务器作出响应前,可以在拦截后修改request和response,这样实现很多开发者想得到的功能. filter是一个可以复用的代码片段,可以用来转换HTT ...

  3. BZOJ 3351: [ioi2009]Regions

    对于一个询问(x,y)对y出现次数分类,若<=lim,在儿子处统计答案,若>lim则y的种类肯定<lim,在祖先处统计(仿佛要去重?但是没去重也过了,那个时限仿佛怎么做都能过) #i ...

  4. day03_01 Python历史、32bit和64bit系统的区别

    先看一下讲师的笔记,有python介绍 在python2.6版本之后,想清理一些东西,追求简单明了,就直接升级到了python3.0 但是python3.0导致很多企业都不更新,因为有很多企业的网站代 ...

  5. Leetcode 466.统计重复个数

    统计重复个数 定义由 n 个连接的字符串 s 组成字符串 S,即 S = [s,n].例如,["abc", 3]="abcabcabc". 另一方面,如果我们可 ...

  6. 九度oj 1006

    题目1006:ZOJ问题 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:20252 解决:3544 题目描述:                        对给定的字符串(只包含'z', ...

  7. Android获取当前应用版本号

    代码改变世界 获取当前应用的版本号 private String getVersionName() throws Exception { // 获取packagemanager的实例 PackageM ...

  8. HDU——1061Rightmost Digit(高次方,找规律)

    Rightmost Digit Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  9. 字符串匹配之Sunday算法

    Sunday算法不像KMP算法那么复杂,但是效率又比较高,在KMP之上,下面简单介绍Sunday算法及其实现. Sunday 算法由 Daniel M.Sunday 在 1990 年提出,它的思想跟 ...

  10. VMware 11 安装Mac 10.9

    VMware Workstation 11, 10, 9 and 8 Unlocker to Run Mac OS X Guests in Windows 8.1 and 7 VM10装Mac OS ...