weblinks svg文件一旦放置在网页中就无法工作

Question

在我的主页上，我试图插入一个 svg，其中包含链接到其他网页的可点击部分。我用 Illustrator 制作了这个 svg，当我直接在浏览器中打开它时，一切正常。但是，一旦我将此 svg 放在我的网页上，单击它后，它似乎会打开一个图像，而不是打开它链接到的实际页面。如果您右键单击并单击“在新选项卡中打开”或“在新窗口中打开”，它会打开链接。

svg 显示在 www.unfoldmyworld.com 上，它是带有可点击图像的世界地图。

这是来自 svg 的关于可点击区域的代码：

<a xlink:href="http://www.unfoldmyworld.com/Africa" xlink:show="replace"> 
        <polygon id="Box-1" fill="#FFFFFF" opacity="0" points="366.938,336.958 461.559,
        336.946 461.583,409.583 481.003,409.56 480.979,449.266 441.263,449.266 441.28,
        431.596 366.938,431.58      "/>

为了将 svg 放到我的 wordpress elementor 页面上，我安装了插件 svg 支持。我已经尝试输入xlink:show="new" 和target="_blank"，但这并没有成功。我还尝试将整个 svg 内联放在一个 html 代码框中，这导致了同样的问题。如果有人能告诉我要如何让这些链接在当前窗口（而不是新窗口）中实际打开预期页面，我将不胜感激。

Answer 1

我自己设法找到了解决这个问题的方法。事实证明，这个问题是由 Elementor 引起的。单击链接时，它会自动打开一个灯箱。要解决此问题，需要将data-elementor-open-lightbox="no" 属性添加到 svg 文件中的链接。