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

这样的效果,怎么实现呢?
很简单
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的使用的更多相关文章
- Bootstrap 提示工具(Tooltip)插件
一.提示工具(Tooltip)插件根据需求生成内容和标记,默认情况下是把提示工具(tooltip)放在它们的触发元素后面. 有以下两种方式添加提示工具(tooltip): 1.通过data属性:如需添 ...
- bootstrap Table 中给某一特定值设置table选中
bootstrap Table 中给某一特定值设置table选中 需求: 如图所示:左边地图人员选定,右边表格相应选中. 功能代码: //表格和图标联动 function changeTableSel ...
- Bootstrap.css 中请求googleapis.com/css?family 备忘录
问题描述: Web中引入bootstrap.css中头部有访问Google服务器的请求 @import url("//fonts.googleapis.com/css?family=Open ...
- 在Bootstrap开发框架中使用Grid++报表
之前在随笔<在Winform开发中使用Grid++报表>介绍了在Winform环境中使用Grid++报表控件,本篇随笔介绍在Bootstrap开发框架中使用Grid++报表,也就是Web环 ...
- 在Bootstrap开发框架中使用dataTable直接录入表格行数据(2)--- 控件数据源绑定
在前面随笔<在Bootstrap开发框架中使用dataTable直接录入表格行数据>中介绍了在Web页面中使用Jquery DataTable插件进行对数据直接录入操作,这种处理能够给用户 ...
- 在Bootstrap开发框架中使用dataTable直接录入表格行数据
在Winform开发的时候,我们很多时候可以利用表格控件来直接录入数据,不过在Web上较少看到,其实也可以利用dataTable对象处理直接录入表格行数据,这个可以提高数据的录入方便,特别是在一些简单 ...
- 在Bootstrap开发框架中使用bootstrapTable表格插件和jstree树形列表插件时候,对树列表条件和查询条件的处理
在我Boostrap框架中,很多地方需要使用bootstrapTable表格插件和jstree树形列表插件来共同构建一个比较常见的查询界面,bootstrapTable表格插件主要用来实现数据的分页和 ...
- 使用BootStrap框架中的轮播插件
在使用bootstrap框架中的轮播插件时,效果做出来后,无法通过点击小圆行的按钮来选择特定的图片. 后面发现是最开始的<div>标签中少写了一个id.一开始<div>标签是这 ...
- 在Bootstrap框架中,form-control的效果
在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果. 1.宽度变成了100% 2. ...
- bootstrap -- meta中的viewport指令
在查看bootstrap教程中,碰到 <meta name="viewport" content="width=device-width, initial-scal ...
随机推荐
- Linux学习-核心编译的前处理与核心功能选择
硬件环境检视与核心功能要求 根据自己的需求来确定编译的选项 保持干净原始码: make mrproper 我们还得要处理一下核心原始码底下的残留文件才行!假设我们是第一次 编译, 但是我们不清楚到底下 ...
- Dijkstra算法_北京地铁换乘_android实现-附带源码.apk
Dijkstra算法_北京地铁换乘_android实现 android 2.2+ 源码下载 apk下载 直接上图片 如下: Dijkstra(迪杰斯特拉)算法是典型的最短路径路由算法,用于计 ...
- java内存模型学习
根据 JVM 规范,JVM 内存共分为虚拟机栈.堆.方法区.程序计数器.本地方法栈五个部分. 虚拟机的内存模型分为两部分:一部分是线程共享的,包括 Java 堆和方法区:另一部分是线程私有的,包括虚拟 ...
- xml ,html,xhtml
html,xhtml和xml的定义: 1.html即是超文本标记语言(Hyper Text Markup Language),是最早写网页的语言,但是由于时间早,规范不是很好,大小写混写且编码不规范: ...
- SVM用于线性回归
SVM用于线性回归 方法分析 在样本数据集()中,不是简单的离散值,而是连续值.如在线性回归中,预测房价.与线性回归类型,目标函数是正则平方误差函数: 在SVM回归算法中,目的是训练出超平面,采用作为 ...
- 九度oj 题目1496:数列区间
题目描述: 有一段长度为n(1<=n<=1000000)的数列,数列中的数字从左至右从1到n编号.初始时数列中的数字都是0. 接下来我们会对其进行m(1<=m<=100000) ...
- [图论训练]1143: [CTSC2008]祭祀river 二分图匹配
Description 在遥远的东方,有一个神秘的民族,自称Y族.他们世代居住在 水面上,奉龙王为神.每逢重大庆典, Y族都会在水面上举办盛大的祭祀活动.我们可以把Y族居住地水系看成一个由岔口和河道组 ...
- BZOJ4598 [Sdoi2016]模式字符串 【点分治 + hash】
题目 给出n个结点的树结构T,其中每一个结点上有一个字符,这里我们所说的字符只考虑大写字母A到Z,再给出长度为m 的模式串s,其中每一位仍然是A到z的大写字母.Alice希望知道,有多少对结点< ...
- docker (centOS 7) 使用笔记1
1. docker配置 初次在安装完docker后,初始化配置 copy默认的docker.service后,重启服务,会在/etc/systemd/system/multi-user.target. ...
- windows10下安装ubuntu16.04 双系统
软件和材料: UltraISO .ubuntu16.04镜像.U盘 步骤: 1.先在windows10 上下载UltraISO并安装 2.打开UltraISO,插入优盘,制作ubuntu160.4 ...