0

我正在开发一个投资组合（http://www.chloémorillon.com/）网站，当我通过所有网络浏览器检查它时遇到了问题。它在 chrome 上运行良好，但是当我用 Safari 检查它时，浏览器会不断刷新页面，直到它确实崩溃。

我使用 SVG 来渲染平行六面体，所以我认为问题来自那里......

这是每个形状框的代码：

<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="485" width="305" class="svg-graphic">
         <filter id="grayscale">
              <feColorMatrix values="0" type="saturate"/>
         </filter>
         <g>
         <clipPath id="hex-mask">
         <polygon points="200, 0  200,284 0,384  0, 100"/>
         </clipPath>
         </g>
         <a xlink:href="http://xn--chlomorillon-eeb.com/projets/">
         <polygon transform="translate(2, 6)" points="200, 0  200,284 0,384  0, 100" stroke-width="10" stroke="#1a171b" fill="#1a171b"/>
         <polygon transform="translate(2, 6)" points="200, 0  200,284 0,384  0, 100" stroke-width="10" stroke="#75ffba" fill="#75ffba" id="bandw"/>
         <image preserveAspectRatio="xMidYMin slice" transform="translate(3, 6)" xlink:href="http://xn--chlomorillon-eeb.com/wp-content/themes/culotte/images/accueil1.jpg" width="100%" height="100%" clip-path="url(#hex-mask)" id="color"/>
        <image preserveAspectRatio="xMidYMin slice" transform="translate(3, 6)" xlink:href="http://xn--chlomorillon-eeb.com/wp-content/themes/culotte/images/accueil1.jpg" width="100%" height="100%" filter="url(#grayscale)" clip-path="url(#hex-mask)" id="bandw"/>
         </a>
     </svg>

你对我的问题有任何线索吗？

4

1 回答 1

0

只是一些一般的调试帮助：当事情失败时，尝试删除代码，直到找到有问题的代码。我会先删除过滤器，因为 Safari 5 不支持 SVG 过滤器。这不应该导致崩溃（它应该只是忽略过滤器）但你永远不知道。

另一个可能的故障点是 utf-8 域http://xn--chlomorillon-eeb.com，尝试相对路径（只是<a xlink:href="/projets">）。

一旦您确定了导致崩溃的代码片段，您就可以设计一个解决方法，使用 javascript 或 Safari 5 的后备。

于 2013-01-09T05:49:15.603 回答