@H_301_3@
我对svg元素的Bootstrap(3.3.7)工具提示有问题.当页面滚动到顶部时,工具提示工作正常.但每当我向下滚动页面时,工具提示都有错误的垂直位置(我向下滚动页面越多,tootltip和tooltiped元素之间的距离就越大).
这是一个提到问题的基本示例(还有带工具提示的测试按钮,它运行良好)：
HTML：
<div class="text-center">
<div class="top-wrap"></div>
<div class="svg-wrap">
<svg height="100" width="100">
<circle id="svg-el" cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
Sorry,your browser does not support inline SVG.
</svg>
</div>
<button id="test-button" type="button" class="btn btn-default">Tooltip on left</button>
</div>
jQuery的：
$(function(){
$('#svg-el').tooltip({
'container': '.svg-wrap','placement': 'top','html':'true','title': '<strong class="text-uppercase">France</strong><br/> example html content.'
});
$('#test-button').tooltip({
'container': 'body','title': 'Example tooltip.'
});
});
见工作jsfiddle.
解决方法
详细说明@ gabel的答案,修复bootstrap v3.3.7,
>转到https://github.com/twbs/bootstrap/blob/v3.3.7/js/tooltip.js
>查找Tooltip.getPosition的声明：Tooltip.prototype.getPosition = function($element){
>违规行是：
var isSvg = window.SVGElement&& el instanceof window.SVGElement
和
var elOffset = isBody？ {top：0,left：0}