![](/img/trans.png)
[英]Dynamically position Bootstrap tooltip (for dynamically generated elements)
[英]Bootstrap Tooltip Position (Dynamic elements)
我正在尝试将我的代码转换为可使用动态元素。
<li data-placement="right" data-toggle="tooltip" data-original-title="abc" title=""></li>
<li data-placement="left" data-toggle="tooltip1" data-original-title="def" title=""></li>
这是我的静态元素代码。 这很好用:
//For RIGHT tooltips...
$("[data-toggle=tooltip]").tooltip({
animation: false,
delay: {show: 0, hide: 0}
});
$("[data-toggle=tooltip]").hover(function(){
$('.tooltip').css('left', parseInt($('.tooltip').css('left')) + 90 + 'px');
});
//For LEFT tooltips... "tooltip1"...
$("[data-toggle=tooltip1]").tooltip({
animation: false,
delay: {show: 0, hide: 0}
});
$("[data-toggle=tooltip1]").hover(function(){
$('.tooltip').css('left', parseInt($('.tooltip').css('left')) - 70 + 'px');
});
到目前为止,这是我有关动态元素的代码。 工具提示出现了,但是我不确定如何更改它的位置。
$('body').tooltip({
selector: '[data-toggle=tooltip], [data-toggle=tooltip1]',
animation: false,
delay: {show: 0, hide: 0},
placement: ????????
});
以下是一些类似的问题:
使用引导程序,位置或偏移量由HTML文档中元素的属性管理。 其“数据放置”属性。
<div class="coolClass" id="coolDiv" data-placement="left" data-toggle="tooltip"
title="Left ToolTip">
<p>Left Tooltip</p>
</div>
这有助于我定位工具提示。 不需要JS
.tooltip.right {
margin-left: 60px;
}
.tooltip.left {
margin-left: -40px;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.