javascript - 是否可以在此工具提示中插入换行符？

Question

我有一张漂亮的美国 map :

http://upload.wikimedia.org/wikipedia/commons/a/a5/Map_of_USA_with_state_names.svg

我想实现一个具有多行功能的工具提示，例如在红色方 block 上:

http://www.carto.net/papers/svg/gui/tooltips/

请帮助我开始做这件事。我将为此提供最高赏金。

Answer 1

为什么不使用一些 jQuery魔术并使用标题“属性”而不是标题“标签”？
我认为您混淆了原来问题中的两者

看看这个 jsFiddle

http://jsfiddle.net/s5qUw/2/

我还使用了 jQuery Tools Tooltip

标记 注意:基本上您需要做的就是将 title 属性和 addtooltip 类添加到任何页面元素你想添加一个工具提示。然后，您可以使用 CSS 为工具提示设置您认为合适的样式。

<path
   id="AK"
   class="addtooltip"
   style="fill:#f2d0ff" 
   onmousemove="GetTrueCoords(evt);"
   title="this sis ak<br>with a line break">
</path>

CSS

.tooltip {
    display:none;
    background-color:black;
    font-size:12px;
    height:40px;
    width:160px;
    padding:25px;
    color:#fff;    
}

脚本(页面底部)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"> </script>
<script src="http://cdn.jquerytools.org/1.2.4/full/jquery.tools.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".addtooltip").tooltip();
    }); // closes document.ready
</script>