Bootstrap Tooltip 显示换行
<a class="pink" href="#" data-toggle="tooltip" data-placement="left" data-html="true" title="AA:123 BB:456">
<div class="table-cell"><i class="icon-hand-right"></i> 点击我 </a>
<script type="text/javascript">
//tooltips
$('[data-toggle="tooltip"]').tooltip();
// $(".pink").tooltip({
// show: null,
// position: {
// my: "left top",
// at: "left bottom"
// },
// open: function (event, ui) {
// ui.tooltip.animate({ top: ui.tooltip.position().top+10}, "fast");
// }
// });
</script>
换行问题
遇到换行,我们首先想到的是将”\n”替换成”<br/>”,我也是这么做的,可惜这在Tooltip中不管用。Tooltip直接把”<br/>”当作文字显示出来了。
jquery-ui-1.10.3.full.min.js 修改该类如下代码:
var i="ui-tooltip-"+s++,n=t("<div>") 改为 var i="ui-tooltip-"+s++,n=t("<pre>")
最后,均可实现html标签内title内容显示时换行。
换行代码符合分别为:
“
”和“
”
Bootstrap Tooltip 显示换行的更多相关文章
- bootstrap tooltip 显示提示信息
参照网上文档,是这样说的, <a data-toggle="tooltip" data-placement="top" title="这是要提示 ...
- 扩展Bootstrap Tooltip插件使其可交互
最近在公司某项目开发中遇见一特殊需求,请笔者帮助,因此有了本文的插件.在前端开发中tooltip是一个极其常用的插件,它能更好向使用者展示更多的文档等帮助信息.它们通常都是一些静态文本信息.但同事他们 ...
- bootstrap插件学习-bootstrap.tooltip.js
先看bootstrap-tooltip.js的结构 var Tooltip = function ( element, options ){} // 构造器 Tooltip.prototype ={} ...
- Bootstrap Tooltip
[Bootstrap Tooltip] 1.设置Tooltip: 1)data-toggle="tooltip" 2)data-placement="top", ...
- 使用tooltip显示jquery.validate.unobtrusive验证信息
通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息,效果如图: 1. 在ViewModel中定义验证规则 [Display(Name = " ...
- Bootstrap Tooltip源码分析
/* ======================================================================== * Bootstrap: tooltip.js ...
- [WPF]TextTrimming截断后,ToolTip显示完整信息
文本过长被截断后,用ToolTip显示完整信息. 文本未被截断,则不显示ToolTip. 值转换器: public class TrimmedTextBlockVisibilityConverter ...
- echarts之字符云tooltip显示混乱问题的解决办法
echarts字符云中tooltip显示混乱主要表现为一下两点: 1.字体与其显示框内容不对应鼠标识别错误 解决思路: 就是option里的数据要对value降序排序(这一点很关键,是必须的一步) 把 ...
- (网页)JS实现alert中显示换行的方法
转自脚本之家: 这篇文章主要介绍了JS实现alert中显示换行的方法,实例分析了两种实现alert换行的实现技巧,非常简单实用,需要的朋友可以参考下 本文实例讲述了JS实现alert中显示换行的方法. ...
随机推荐
- PHP设计模式概念
设计模式(Design Pattern)是对软件设计中普遍存在(反复出现)的各种问题,所提出的解决方案 设计模式并不直接用来完成代码的编写,而是描述在各种不同情况下,要怎么解决问题的一种方案.面向对象 ...
- spring/java ---->记录和整理用过的注解以及spring装配bean方式
spring注解 @Scope:该注解全限定名称是:org.springframework.context.annotation.Scope.@Scope指定Spring容器如何创建Bean的实例,S ...
- Introduce oneself
首先,我是一个男生, 我很喜欢打游戏,钟爱LOL,接触它已经7年了.虽然还是很菜,但就是喜欢.选择计算机科学与技术这个专业呢,就是因为喜欢电脑,可以和室友一起开黑,然而室友都不玩,有点难受. 此外呢, ...
- opencv3.0配置opencv_contrib
在opencv3.0中无法直接使用sift,surf等特征点检测算子,需要额外配置opencv_contrib. 在查看网上诸多教程,失败n次后,终于找到了正确的配置方式. visual studio ...
- CDI
CDI,JAVA用语 Java EE CDI 主要使用@Inject注解来实现依赖注入,把受管理的bean注入到由容器管理的其它资源中去.在本教程中,我们将会介绍在CDI环境下几种不同的可选策略来实现 ...
- 原生sql实现restful接口调用
index.php <?php include './Request.php';include './Response.php';//获取数据$data=Request::getRequest( ...
- dubbo 异步回调
dubbo 异步回调的使用 业务接口: public interface HelloService { String sayHello(); void sayHi(String name); } 回调 ...
- Java语法基础学习DaySeventeen(多线程续)
一.线程的特点 1.线程的分类 java中的线程分为两类:守护线程和用户线程.唯一的区别是判断JVM何时离开. 守护线程是用来服务用户线程的,通过在start()方法前调用Thread.setDaem ...
- error ...项目路径 \node_modules\chromedriver: Command failed.
当你拿到完整的vue项目代码,像 node_modules 整个文件夹不可能提交到svn或者github的, 所以怎么自己安装整个项目所需要的一些依赖呢, 前提是你全局安装了node,才能使用nom命 ...
- 高级数据类型--字典(dict)
一.字典介绍 dict(字典) 是 除列表以外 Python 之中 最灵活 的数据类型.字典同样可以用来 存储多个数据,通常用于存储 描述一个 物体 的相关信息 和列表的区别: 列表 是 有序 的对象 ...