SnapSVG浏览器不兼容

这段代码如何在chrome中而不是在Firefox中顺利运行？我使用SnapSVG。SnapSVG浏览器不兼容

JS：

var pinguin = Snap("#pinguin"); 

Snap.load("pinguin.svg", bodyload) ; 
function bodyload(data){  
    pinguin.append(data); 
};

HTML：

<svg id="pinguin" ></svg> 
<script src="snap.svg.js"></script> 
<script src="main.js"></script>

我得到在Chrome： Chrome 我得到的Firefox： enter image description here

我试图让一个小提琴，但是fiddle doesn't work.

相反，代码和显示可以在这里得到：http://www.pinguin.moe/

你知道我该如何修复Firefox上的显示？

来源

2014-11-05 sidney

我认为你需要为你的外部SVG添加一个宽度和高度。有一个在svg文件中，但没有在主页面的标记中。例如，如果将其设置为800,600，它应该可以工作。

<svg id="pinguin" preserveaspectratio="xMinYMin meet" viewbox="0 0 300 750" width="800" height="600">

来源

2014-11-05 12:01:21 Ian

谢谢，但后来SVG并没有采取响应方式的全屏，就像我在Chrome上得到的那样。我的意思是，现在在Chrome上，即使用户调整窗口大小，SVG也会占用全屏幕高度，这要归功于'preserveAspectRatio'属性。但是当去除宽度和高度时，它不会保持那个比例:( – sidney 2014-11-05 18:43:51

SnapSVG浏览器不兼容

回答

相关问题