如何使用Javascript檢測SVG動畫並顯示/隱藏Flash/SVG對象？

我一直在嘗試使用SMIL創建SVG動畫。它在最新的Firefox中運行良好，但它當然在IE中不起作用。我已經有一個類似的Flash動畫。我的計劃是在頁面中包含Flash和SVG動畫，並基於javascript檢測來顯示/隱藏它們。但是我在JavaScript中很糟糕，並不知道如何去做。我將使用鏈接的.js文件。我的計劃是在頁面加載時檢測瀏覽器是否支持「http://www.w3.org/TR/SVG11/feature#AnimationEventsAttribute」功能，如果支持，請隱藏Flash對象（id =「rotateFlash 「）並顯示SVG對象（id =」rotateSVG「）。如何使用Javascript檢測SVG動畫並顯示/隱藏Flash/SVG對象？

我不知道是否有更好的方法來實現我想要的，並且我還沒有發現任何類似於我想要實現的代碼。我找到了show/hide javascripts，但不知道如何實現與他們的檢測功能。這個代碼似乎至少做了一些事情，但它似乎遵循「else」命令，這意味着Firefox沒有檢測到該功能爲「真」（IE9，但這是預期的）。

function supportsSvg() { 
    if(document.implementation.hasFeature ("http://www.w3.org/TR/SVG11/feature#AnimationEventsAttribute", "1.0") == "true") { 
    document.getElementById("rotateSVG").style.display = ""; 
    document.getElementById("rotateFlash").style.display = "none"; 
    } 
    else { 
    document.getElementById("rotateSVG").style.display = "none"; 
    document.getElementById("rotateFlash").style.display = ""; 
    } 
}

我不知道還有什麼要做。我嘗試了其他更簡單的SVG功能，但我得到了相同的結果。我一直在閱讀Modernizr，但對我來說似乎太複雜了。我不明白如何，爲什麼，如果它能工作。

來源

2012-06-28 Maxor

我想我終於找到了它的工作。看完代碼後，我有一種感覺== "true"是不必要的，所以我刪除它。現在它似乎在Firefox 13和IE9中工作。

function supportsSvg() { 
    if(document.implementation.hasFeature ("http://www.w3.org/TR/SVG11/feature#AnimationEventsAttribute", "1.0")) { 
    document.getElementById("rotateSVG").style.display = ""; 
    document.getElementById("rotateFlash").style.display = "none"; 
    } 
    else { 
    document.getElementById("rotateSVG").style.display = "none"; 
    document.getElementById("rotateFlash").style.display = ""; 
    } 
}

來源

2012-06-29 07:19:34 Maxor

如何使用Javascript檢測SVG動畫並顯示/隱藏Flash/SVG對象？

回答

相關問題