2011-04-02 50 views
0
顯示SVG

大家好,我只是想知道是否有人曾與使用嵌入標記在IE9中顯示SVG任何經驗。下面是我的代碼示例:使用嵌入標籤在IE9

<!DOCTYPE html> 
<html><head><title>Example</title></head> 
<body> 
<embed id="E" height="50%" width="100%" src="example.svg"> 
</body> 
</html> 

眼下這將顯示在Firefox就好了,IE 8使用Adobe插件,但在IE 9,它只是彈出一個空白框與影像圖標左上角的盒子。有沒有人有任何想法我可以解決這個問題?

+0

出於興趣是什麼文件模式是IE9 viweing你的HTML時使用?我認爲後可以描述問題和解決方案:http://stackoverflow.com/questions/6111785/inline-svg-content-not-displaying-in-ie-screenshot – James 2011-08-02 13:06:30

回答

3

Althought您的片段包括HTML5 DOCTYPE定義有哪些影響IE9究竟如何處理例如你的HTML等因素的影響HTTP響應頭(請參閱How Internet Explorer Chooses Between Document Modes

我認爲如果您強制IE9進入標準模式,您的SVG將由IE9呈現;快速測試這個只需使用Developer Tools來控制瀏覽器和文檔模式。

因此,如果您embdeded SVG現在會顯示你剛剛離開,首先要弄清楚什麼是觸發IE9選擇了錯誤的文檔模式。

1

我不知道,如果你的問題意味着你想找出任何方式在IE9中顯示SVG,或專門只與<embed>標籤。如果你只是想辦法在IE9中顯示SVG,我建議直接在XHTML5嵌入SVG:

<!DOCTYPE HTML> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> 
    <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> 
    <title>untitled</title> 
    <style type="text/css" media="screen"> 
    body { background:#eee; margin:1em } 
    svg { background:#fff; display:block; border:1px solid #ccc; width:100%; margin:1em -1px } 
    </style> 
</head><body> 
<svg viewBox="-500 -500 1000 1000" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full"> 
    <!-- SVG content here --> 
</svg> 
<script type="text/javascript"><![CDATA[ 
    var svg = document.getElementsByTagName('svg')[0]; 
    var svgNS = svg.getAttribute('xmlns'); 
    // Access/manipulate your SVG here 
]]></script> 
</body></html> 

如果你想測試這項技術,這裏有使用SVG在IE9工作的一些例子(在我的網站) :

如果這不是你想要的,請說明你的需求是什麼。