Bootstrap插件1--tooltip
在引入bootstrap.js之前我们需要引入jquery的js文件
既然是bootstrap的插件,那么自然需要引用bootstrap.js和bootstrap.css这2个核心文件了
这里了主要介绍tooltip提示信息插件的常用使用方法
<a href='javascript:;' rel='tooltip' title='我就是提示的信息' class='btn btn-primary'>点击出现提示信息</a>
调用方法:
<script>
$(function () {
$("a[rel='tooltip']").tooltip();
})
</script>
这样:tooltip的信息就自动显示在对应的元素的上方
那么,如果要让这个提示信息显示在其他地方呢?
很简单:
控制方位的属性是 data-replacement='?' ?可以是 top , bottom, left, right
<a href='javascript:;' rel='tooltip' data-original-title='Tooltip on bottom' data-placement='bottom' class='btn btn-primary'>点击出现提示信息</a>
顺便说一下:data-original-title属性和title属性作用是一样的,如果同时定义了这2个属性,只会显示title属性的提示内容。
Bootstrap插件1--tooltip的更多相关文章
- Bootstrap 提示工具(Tooltip)插件的事件
事件 下表列出了提示工具(Tooltip)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 show.bs.tooltip 当调用 show 实例方法时立即触发该事件. $('#m ...
- Bootstrap 提示工具(Tooltip)插件方法的用法
方法 下面是一些提示工具(Tooltip)插件中有用的方法: 方法 描述 实例 Options: .tooltip(options) 向元素集合附加提示工具句柄. $().tooltip(option ...
- Bootstrap -- 插件: 提示工具、弹出框、 警告框消息
Bootstrap -- 插件: 提示工具.弹出框. 警告框消息 1. 提示工具(Tooltip)插件:根据需求生成内容和标记. 使用提示工具: <!DOCTYPE html> <h ...
- BootStrap插件
站点引用 Bootstrap 插件的方式有两种: 单独引用:使用 Bootstrap 的个别的 *.js 文件.一些插件和 CSS 组件依赖于其他插件.如果您单独引用插件,请先确保弄清这些插件之间的依 ...
- 20个超棒的jQuery bootstrap 插件
1. Bootstrap File Input Bootstrap3.x 的一个增强版的HTML 5 文件选择控件,可以对图片文件和文本文件进行预览,以及其他功能.该插件增强了这些插件,并且将组件的初 ...
- bootstrap插件思路整理
知识有时也需温故知新嘛,本次做一次bs插件梳理. $.support.transition 通过判断自定义元素是否支持WebkitTransition.MozTransition.OTransitio ...
- Bootstrap插件的使用
昨天,我偶然间发现了它——BootStrap插件,它是一一套功能强大的前端组件.说起来,我跟这插件还真算得上有缘,我本来并不是去找这个插件的,我本来是找BootStarp Paginator这个分页插 ...
- bootstrap插件学习-bootstrap.dropdown.js
bootstrap插件学习-bootstrap.dropdown.js 先看bootstrap.dropdown.js的结构 var toggle = '[data-toggle="drop ...
- bootstrap插件学习-bootstrap.modal.js
bootstrap插件学习-bootstrap.modal.js 先从bootstrap.modal.js的结构看起. function($){ var Modal = function(){} // ...
- Bootstrap -- 插件: 按钮状态、折叠样式、轮播样式
Bootstrap -- 插件: 按钮状态.折叠样式.轮播样式 1. 按钮(Button)插件:可以添加进一些交互,比如控制按钮状态. 如需向按钮添加加载状态,只需要简单地向 button 元素添加 ...
随机推荐
- jquery之别踩白块游戏的实现
转载请注明出处http://www.cnblogs.com/Wxtrkbc/p/5687112.html 前端学习要告一段落了,也没机会写什么像样的东西,然后无意中想起某人以前给我玩了一下别踩白块的游 ...
- 微信聊天测试脚本 wx_sample.php
<?php </FuncFlag> </xml>); curl_setopt($ch, CURLO ...
- android开发时,finish()跟System.exit(0)的区别
这两天在弄Android,遇到一个问题:所开发的小游戏中有背景音乐,玩的过程中始终有音乐在放着,然后在我退出游戏后,音乐还在播放! 我看了一下我最开始写的退出游戏的代码,就是简单的finish() ...
- js:语言精髓笔记9--函数式语言特征
形式化运算系统的研究: 图灵:提出图灵机形式系统,通过0,1运算系统来解决复杂问题: 冯诺依曼:提出了冯诺依曼体系:即通过修改内存反映运算结果: 阿隆左.丘奇:提出新的运算范型Lambda演算,计算机 ...
- 编程第一个Apple Watch程序创建项目
编程第一个Apple Watch程序创建项目 2.4 编程第一个程序 本节将通过编写第一个程序,为开发者讲解如何添加Watch应用对象.运行程序.界面设计.编写代码等内容本文选自Apple Watc ...
- 转-CSS3 圆角(border-radius)
CSS3 圆角(border-radius) 前缀 例1 例2:无边框 书写顺序 其它 支持性 值:半径的长度 前缀 -moz(例如 -moz-border-radius)用于Firefox -w ...
- http://jingyan.baidu.com/album/d8072ac47baf0eec95cefdca.html?picindex=4
http://jingyan.baidu.com/album/d8072ac47baf0eec95cefdca.html?picindex=4
- How far away[HDU2586]
How far away ? Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) T ...
- 分拆素数和[HDU2098]
分拆素数和 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submi ...
- ! cocos2d 同一个sprite的触控问题
如果对一个A sprite添加触控,然后在一个场景中创建四个A的实例,那么1234逐个添加的话,只有最后一个会被点击到.其他的将不会响应.