Html svg悬停在ff中工作，chrome禁止进入IE 9 10 11

[编辑]很抱歉，这是我第一次在这里寻求帮助。代码最初没有正确粘贴，因此这里是我创建的JSFIDLE的链接，该链接是在注释中请求的，再次感谢！[编辑]（如果你悬停在空白看按钮，你会看到效果。）< /P>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

完整代码附在下面。基本上，我已经尝试了几种不同的方法，它似乎工作得很好，直到我在IE中测试它。基本上，我有一个圆圈菜单，我用一个在线工具生成。由于圆圈在中间，我计划更改按钮悬停时的填充图像

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

下面的代码是我认为可能存在的问题的副本。它在Chrome和Firefox中运行良好，但IE 9 10 11是不行的

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

请帮忙，这是我第一次为我的客户机做svg实验

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

提前谢谢

    <pattern id="image2" x="0" patternContentUnits="objectBoundingBox" y="0" height="100%" width="100%">
  <image x="0" y="0" width="1" height="1" preserveAspectRatio="none" xlink:href="http://ewi.silviotech.com/wp-content/themes/ExhibitWorks2015/images/logomain_01.png">
  <set attributeName="xlink:href" to="http://silviotech.com/wp-content/themes/SilvioTech2015/images/logol.png" begin="item12.mouseover" end="item12.mouseout"/> </image>   
   </pattern>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

#菜单{
显示：块；
保证金：0自动；
/*溢出：可见；*/*如果正在使用反弹动画，请取消对此的注释*/
}
a{
光标：指针；
大纲：无；
}
/*您可以按任何方式更改这些默认样式*/
.项目.部门{
过渡：所有。1s线性；
填充：#fff；
冲程：#111；
}
.item:hover.sector，.item:focus.sector{
填充：#eee；
}
.菜单触发器{
填充：#EA2A55；
指针事件：自动；
}
.菜单触发器：悬停，.菜单触发器：聚焦{
光标：指针；
}
象征{
溢出：可见；/*保留此选项，以便文本不会被截断，因为它比图标宽度宽*/
}
#环风
{
背景：#fff；
}
1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

                    </circle>

                <!-- menu button label or icon goes here -->

            </svg>

你能创建一个JSFIDLE吗？它将更容易编辑和测试。很抱歉，我粘贴它时代码没有正确复制，因为这是我第一次在这里寻求帮助。我也意识到图片大小不合适，我只是扔了几个链接到我自己的网站的图片。。。JSFIDLE使用ff、chrome，但不使用ie任何版本。（如果您悬停在空白查找按钮上，您将看到效果。）IE不支持SMIL。不过，您可以使用polyfill支持。谢谢，我今天早上实施了此修复。我也对smil做了一些研究，令人惊讶的是还没有ie支持它。在阅读了fakesmile之后，对于我的解决方案来说，它应该是一个完美的解决方案，我没有做任何太详细的事情，它似乎为旧浏览器提供了支持，所以我不必担心。再次感谢！请您创建一个JSFIDLE，它将更容易编辑和测试对不起，当我粘贴它时，代码没有正确复制，因为这是我第一次在这里寻求帮助。我也意识到图片大小不合适，我只是扔了几个链接到我自己的网站的图片。。。JSFIDLE使用ff、chrome，但不使用ie任何版本。（如果您悬停在空白查找按钮上，您将看到效果。）IE不支持SMIL。不过，您可以使用polyfill支持。谢谢，我今天早上实施了此修复。我也对smil做了一些研究，令人惊讶的是还没有ie支持它。在阅读了fakesmile之后，对于我的解决方案来说，它应该是一个完美的解决方案，我没有做任何太详细的事情，它似乎为旧浏览器提供了支持，所以我不必担心。再次感谢！