存在外部链接时，填充上的SVG css3转换不起作用

我有一个类似于此的问题：

唯一的区别是我想要链接SVG的页面是一个外部页面，意思是：

目前在我的代码中，将链接更改为内部页面可以使css3转换工作，但将其链接到外部页面（http://）会覆盖我所做的css3转换

如果任何人有解决此问题的方法或以前处理过此问题。请帮忙

谢谢

    code

编辑： 忘记！

---

这实际上与访问状态有关。其他评论者之所以说它有效，是因为他们以前没有看过你的页面。一旦他们有了，它就不再起作用了。我尝试过在CSS中添加访问过的状态，但没有任何区别

我发现的最简单的解决方案是只向url添加一个随机查询字符串，这样页面就不会被有效访问，例如：

大多数网站会忽略一个他们无法识别的查询，所以这应该没问题。或者更好的方法是在单击时使用JS将其删除

$('body').on('click', 'a', function(e) {
    e.preventDefault();
    var url = $(this).prop('href');
    window.location.href = url.split("?")[0];
});

---

我回答这个问题有点晚了，但为了防止它可能会帮助其他人最终出现在这个页面上，这个问题似乎是由一个错误引起的。基本上，一旦链接被访问，转换就停止工作

---

因此，要解决这个问题，假设您不想等待bug被修复，那么您需要使用一种策略来欺骗浏览器，使其认为链接尚未被访问

截至本文撰写之时，至少Safari和IE 11中仍然存在该缺陷，但使用

currentColor

填充SVG似乎可以解决它

---

我刚刚将锚点更改为div，并向其添加了一个包含URL的数据属性：

然后我添加了一些JavaScript来获取URL并将其附加到location对象：

document.getElementById（“homeLink”）.addEventListener（'click'，function（）{
var url=this.getAttribute（'data-url'）；
window.location.href=url；
}，假）；

你可以为此制作一个JSFIDLE吗？奇怪的是，即使我在内部链接它，淡入淡出只在第一次单击时起作用（target=“\u blank”），然后链接恢复为正常悬停而不转换。Sry！添加了JSIDLE链接！谢谢这在最新的Google Chrome上运行得非常好…我在最新的Chrome上。它只对我第一次点击有效。之后，这种转变是突然的（事实上，自2012年以来，它似乎被标记为关闭……我猜是回归。如果我们能找到一个非黑客的解决方法……或者如果只有webkit团队会参与进来的话！但我越想它，我就越觉得这是一个天才的解决方法！（我使用当前时间——小时、分钟、秒、天、月——作为我的“随机查询字符串”）谢谢@JoelFarris！这似乎在Chrome now中得到了修复。是的，我现在只在Safari中看到它。更新！如果使用“currentColor”作为SVG填充，这个错误（至少在Safari和IE 11中仍然存在）似乎不会发生！示例：我将在下面添加一个答案。太棒了！谢谢@Joel

<svg><path fill="currentColor"/></svg>