为了账号安全,请及时绑定邮箱和手机立即绑定

tooltip怎么显示一个大块的内容

  <h4>data-html="true"</h4>

  <button type="button" 

  class="btn btn-default" 

  data-toggle="tooltip" 

  data-placement="bottom" 

  data-original-title="<img src='http://placehold.it/400'/>"

  data-html="true">data-html="true"</button>


  希望显示一个大块的内容,比如上面代码中的一个大的图片

  问题如下:

  1.  能只指定半个方向不? 比如上下,然后代码自动根据上下的距离去显示,朝上还是朝下,同理,左右也是如此。

  2.  显示框的黑边是太小了


正在回答

2 回答

如果有这种特殊需求,我觉得可以直接去修改 tooltip的样式,比如你的图片大小是100*100,去改变tooltip的 宽和高,为了不影响其他tooltip的样式,可以自己定义一个样式去覆盖

0 回复 有任何疑惑可以回复我~

bootstrap tooltip里有相应的API

data-template 就是可以根据自己需要修改原始html


data-template的默认值是

'<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'

tooltip-arrow 是提示框的三角形

tooltip-inner title的值会被注入到这里

tooltip 是包裹上面两个用的

知道这些 你就可以想改哪里 改哪里


举个栗子

增大字体尺寸

$("#button1").tooltip({

        title:"lala",

        template:'<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner" style="font-size:40px;"></div></div>'

    });


1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

tooltip怎么显示一个大块的内容

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信