SVG PATH有两个没有笔划的顶点,有相同的y坐标,只对Safari中的mouseevent没有响应。
请注意,端点顶点的y坐标是相同的:
<div class="container">
<section class="ui-interactable-content" style="transform: scale(1); width: 100%; height: 100%;"><svg class="path-selection-svg">
<path class="path-selection-svg-path" d="M 4 4 L 92.99999999999994 4"></path>
<path class="path-selection-svg-shape" d="M 4 4 L 92.99999999999994 4"></path>
</svg>
</section>
</div>
效果在此复制: http://jsfiddle.net/mf6ueqef/
这在chrome,IE,FF中运行良好。
任何人都知道如何解决这个问题?
答案 0 :(得分:1)
我发现了这个问题。 当路径的终点'y坐标相同,并且笔划为无。时,看起来Safari不响应指针事件。
修复很简单: 只需使笔画非无
stroke: rgba(255,0,0,0.01);