-- 发布时间：9/16/2006 5:24:00 PM
-- 在SVG中如何显示鼠标提示框，及请高手解决其中bag
[B]在SVG中如何显示鼠标提示框
代码如下：
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="100%" height="100%" onload ="initialize(evt)">
<script type="text/ecmascript">
<![CDATA[
var svgdok, tttelem, tooltip, ttrelem;
function initialize(evt)
{
svgdok = evt.getTarget().getOwnerDocument();
tttelem = svgdok.getElementById("ttt");
ttrelem = svgdok.getElementById("ttr");
tooltip = svgdok.getElementById("tooltip");
}
function mOver(evt, text)
{
tttelem.childNodes.item(0).data = text;
ttrelem.setAttribute("x",evt.clientX + 25);
ttrelem.setAttribute("y",evt.clientY + 25);
tttelem.setAttribute("x",evt.clientX + 30);
tttelem.setAttribute("y",evt.clientY + 37);
ttrelem.setAttribute("width",tttelem.getComputedTextLength()+10);
tooltip.setAttribute("visibility","visible");
}
function mOut(evt)
{
tooltip.setAttribute("visibility","hidden");
}
]]>
</script>
<g id="testG" onmouseover = "mOver(evt, 'Welcome To Here!')" onmouseout = "mOut(evt)">
<rect x="100" y="100" width="100" height="50" style="fill:rgb(120,255,255);"/>
</g>
<g id ="tooltip" visibility =" hidden">
<rect id="ttr" x="0" y="0" width="100" height="15" fill="rgb(255,255,255)" stroke="rgb(9,0,130)" stroke-width="1" shape-rendering="optimizeSpeed"/>
<text id="ttt" x="0" y="0">dyn. Text</text>
</g>
</svg>
在IE6中显示如下图：
此主题相关图片如下：
其中的bag，在图形不平移时提示框的位置可以正常显示，可是如果我们将图形平移之后提示框的位置与鼠标也发生了相应的平移，请高手解释一下这问题的原因和解决办法。
谢谢！