我有一张漂亮的美国地图:
http://upload.wikimedia.org/wikipedia/commons/a/a5/Map_of_USA_with_state_names.svg http://upload.wikimedia.org/wikipedia/commons/a/a5/Map_of_USA_with_state_names.svg
我想实现一个具有多行功能的工具提示,例如红色方块上的工具提示:
http://www.carto.net/papers/svg/gui/tooltips/ http://www.carto.net/papers/svg/gui/tooltips/
请帮助我开始做这件事。我将为此提供最高赏金。
为什么不使用一些jQuery http://jquery.com/魔法并使用标题“属性”而不是标题"Tag"?
我认为您在最初的问题中混淆了两者
看看这个 jsFiddle
http://jsfiddle.net/s5qUw/2/ http://jsfiddle.net/s5qUw/2/
我也用过jQuery 工具提示 http://flowplayer.org/tools/demos/tooltip/index.html
Markup 注意:基本上您需要做的就是添加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(页面底部)
<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>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)