4

Can you please take a look at this JsFiddle and let me know that how I can center the tooltip inside the SVG? I already see the same question on this post but to be honest it was too confusing for me!

Here is the code I have:

<div class="container">
 <div class="well">
  <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="400px" height="400px" viewBox="0 0 400 400" enable-background="new 0 0 400 400" xml:space="preserve">
    <ellipse class="firststar" cx="200" cy="200" rx="150" ry="150"/>
   </svg>
 </div>
</div>

and the jquery code:

$('.firststar').tooltip({title:'Test SVG Centering', container:'.well', placement: 'top'});
4

1 回答 1

2

这些是详细说明的步骤:

  1. 下载引导源

  2. 您链接到的问题显然可以解决 Boostrap 中的错误。复制 getPosition 的代码。在工具提示开关中为 center 添加一个 case(Ctrl+F 再次为 getPosition,但找到的不是函数,而是它的用途),如下所示:

    case: 'center':
      tp = {top: pos.top + pos.height / 2 - actualHeight / 2, 
            left: pos.left + pos.width / 2 - actualWidth / 2}
      break
    
  3. 确保更改 HTML 中的链接以引用更新后的 bootstrap.js 文件。

编辑:链接到工作 JFiddle。自另一篇文章以来,引导代码已更改,这是实现您想要的最简单的方法。

于 2013-06-21T17:47:07.880 回答