Internet Explorer中svg文本元素悬停时的"textLength“更改
Internet Explorer中svg文本元素悬停时的"textLength“更改
提问于 2015-12-15 22:26:41
我正在使用svg-text-element进行网站布局，并且我正在更改textLength-属性以使菜单中的所有菜单项都具有相同的长度。(当您更改textLength时，间距将自动调整，字母大小保持不变)
<div class="menu-item">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<text class="hover-black" lengthAdjust="spacing" fill="black">AGENDA</text>
</svg>
</div>"textLength“和定位是在JavaScript中完成的。
一切正常，除了在Internet Explorer中，当我将鼠标悬停在Menu-Text上时，textLength属性似乎会被删除，而我悬停在上面的svg-text会以标准间距翻转回来。
在CSS或JS中没有为悬停设置任何内容...
也许有人有一个想法，非常感谢！
编辑:已解决！抱歉打扰你们了。我发现了一个：
.menu-item {
&:hover {
cursor: pointer
}
}我在css中忽略了这一点。似乎是IE中的一个bug。
回答 1
Stack Overflow用户
发布于 2017-12-08 00:22:04
尝试将style="pointer-events:none"添加到实际的文本标记。这至少应该可以在IE11中修复它。在SVG中使用lenghtAdjust时，我遇到了类似的IE行为异常的问题。
所以你看起来就像这样：
<div class="menu-item">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<text class="hover-black" x="30" y="30" textLength="250" fill="black" style="pointer-events:none">AGENDA</text>
</svg>
</div>我试过用一个类来做这件事，但也不起作用。仅当我将其作为内联CSS添加到text标记时。
对我来说，使用cursor:pointer还是有些奇怪。要重现此问题，请尝试双击IE中的文本。它会跳到右边或左边。如果这是一个导航项，那么你需要做一个活动的链接(也许是rect？)下面的文本和pointer-events:none已经允许你点击浏览文本。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34291708
复制相关文章
相似问题
腾讯云开发者
