IE9，IE8，SVG，VML和doctypes

我正在繪製ASP.NET Web應用程序中的圖形。在IE9和其他瀏覽器中，我使用SVG來完成它，並且它工作得很好。在IE8及以下版本中，我使用VML。我發現當IE8標準模式下（不使用兼容性視圖）IE8不顯示VML。IE9，IE8，SVG，VML和doctypes

我的文檔類型設置爲<!DOCTYPE html>。如果我將文檔類型完全刪除，IE8進入怪癖模式並且工作正常，但是IE9然後去其怪癖模式（而不是IE9標準）並且不顯示SVG。

這是發生在測試頁面上，所以除了包含包含<svg>元素及其子元素或VML元素的div的表單之外，沒有任何內容。

這是怎麼回事？似乎我不應該爲不同的瀏覽器更改文檔類型，並且Stack Exchange用戶頁面上的信譽圖似乎以相同的方式工作（針對IE8及更低版本的VML，針對其他人的SVG，HTML5文檔類型）...

來源

2012-05-31 Tom Hamming

你有沒有想過在doctype上使用條件語句？ '<！ - [if IE 8]><！doctype ...>'我知道這不是你的問題，但它可能是一個替代解決方案。 – Eruant

要聲明在IE8標準模式的VML命名空間，則需要包括第三'#default#VML' argument：

document.namespaces.add('v', 'urn:schemas-microsoft-com:vml', '#default#VML');

有other changes到VML在IE8中，你可能需要知道的。

來源

2012-07-03 23:22:05

我實際上在底部使用他的建議強制IE7標準模式，使一切工作。如果是IE8，那麼'Response.AppendHeader（「X-UA-Compatible」，「IE = EmulateIE7」）;' –

有一對夫婦更多的事情，你需要檢查：需要修改

選擇的行爲規則。

當設置元素的尺寸或位置時，單位不會默認爲px。它必須明確規定工作。
不能在DOM之外創建一個VML元素：

。

var vmlFrag = document.createDocumentFragment(); 
vmlFrag.insertAdjacentHTML('beforeEnd', 
'<v:rect id="aRect" fillcolor="red"   
style="top:15px;left:20px;width:50px;height:30px;position:absolute;"></v:rect>' 
); 
document.body.appendChild(vmlFrag);

的rect元素將不會被顯示出來！你不能修改它的CSS，因爲你可能只會崩潰瀏覽器。但是，它有一個修復。將元素的外部HTML複製到自身中：

。

var aRect = document.getElementById('aRect'); 
aRect.outerHTML = aRect.outerHTML;

來源

2012-07-10 10:17:33 miracules

HighCharts源代碼給出了一個解決方案。除了在運行時添加的命名空間，你也有添加特定CSS行爲：

<!--[if lte IE 8 ]> 
<script type="text/javascript"> 
    document.namespaces.add('vml', 'urn:schemas-microsoft-com:vml'); 
    document.createStyleSheet().cssText = 
     'vml\\:fill, vml\\:path, vml\\:shape, vml\\:stroke' + 
     '{ behavior:url(#default#VML); display: inline-block; } '; 
</script> 
<![endif]-->

之後，創建的元素JS會在頁面上可見。 Watch the demo。

來源

2013-01-09 14:10:31 nniico

謝謝你的解決方案對我有用。 – SivaRajini

IE9，IE8，SVG，VML和doctypes

回答

相關問題