设计规范
开发者文档
文档写的渣，有任何疑惑可以直接留言或者联系@半边
1.快速上手
<a href="#" data-toggle="tooltip" title="first tooltip">hover over me</a> 一行js都不用写，参数写成data-xxx属性即可
如果触发节点的所有祖先元素中存在同时满足下面2个条件的祖先元素:
1.他宽度/高度小于tip元素的宽度/高度。
2.他是absolute/fixed定位方式。
那么需要你在CSS中为该.sui-tooltip指定width/height。否则会因为元素塌陷使定位出错。
原bootstrap tooltip的参数template已废弃
可以通过data属性或JavaScript传递参数。绝大部分参数可写在触发元素的data-xxx属性里,在触发元素上设置data-toggle="tooltip"（类似dialog）即可。
扩展则可继续添加data-xxx属性注入参数实现。有一个例外，tooltip的内容参数title不需要加data-前缀，它是html标准属性。
$eles.tooltip(options)
对一组页面元素绑定一个工具提示处理器。
$eles.tooltip('show')
弹出某个页面元素的工具提示。
$('#element').tooltip('show')
$eles.tooltip('toggle')
打开或隐藏某个页面元素的工具提示。
$('#element').tooltip('toggle')
$eles.tooltip('destroy')
隐藏并销毁某个页面元素的工具提示。
$('#element').tooltip('destroy')
{
animation: true //是否以动画效果淡入淡出tooltip
, type: 'default' //tip 类型 {string} 'default'|'attention'|'confirm' ,区别见demo
, placement: 'top'
, selector: false //通常要配合调用方法使用，如果tooltip元素很多，用此途径进行事件委托减少事件监听数量: $('body').tooltip({selector: '.tips'})
, trigger: 'hover focus' //触发方式，多选：click hover focus，如果希望手动触发，则传入'manual'
, title: 'xxx' //{string | function} tooltip的内容，如果给html元素添加了title属性则使用该html属性替代此属性。js调用生成的方式可以传入一个函数，返回值即title。
, delay: 0 //如果只传number，则show、hide时都会使用这个延时，若想差异化则传入形如{show:400, hide: 600} 的对象 注：delay参数对manual触发方式的tooltip无效
, html: true //决定是html()还是text()
, container: false //将tooltip与输入框组一同使用时，为了避免不必要的影响，需要设置container.他用来将tooltip的dom节点插入到container指定的元素内的最后，可理解为 container.append(tooltipDom)。
, width: '100px'|'100%' // {string} tip元素的宽度，默认根据内容宽度决定，可人工设置。人工设置宽度，则忽略最大宽度限制
, widthlimit: true // {Boolean|string} tooltip元素最大宽度限制，false不限宽，true限宽300px，也可传入"500px",人工限制宽度
, align: 'center' // {string} tip元素的布局方式，默认居中：'center' ,'left','right','top','bottom'
, okHide: fn //带确认、取消按钮的tooltip，点击确认时的回调。需要关闭tooltip则执行 $(this).tooltip('hide')
, hide: fn //tooltip以任何原因关闭消失时的回调,若有渐隐动画，则在动画执行前调用。
}
tooltip作为展示型便携组件本不需要事件，不过为了补充confirm类型的tooltip，目前提供一个常见事件:
okHide 带确认、取消按钮的confirm型tooltip，点击确认时的回调。执行 this.hide() 可以关闭对应tooltip)
通过js调用生成的tooltip，同时也可接收htmldata-*属性参数，二者mix后作为最终方法参数。
因为可以通过$('#xxx').tooltip(opt)指定任意元素$('#xxx')为触发元素，所以不要z再为触发元素添加data-toggle="tooltip"的HTML属性。
AGAIN: 通过js调用生成的tooltip一定不要为触发元素附加data-toggle="tooltip"
如果不想用tooltip，但若只想要三角效果，对三角父元素用.tooltip-only-arrow和.top(或.bottom/.right/.left)
箭头的位置想自己调整可以根据业务需求修改外层.tooltip-arrow的left样式