目前正在為我的作業場所開發一個新網站，我被要求讓它更快、更優化，所以我決定對所有影像使用 WebP 以減少加載時間，唯一的缺點是，我們被迫使用 IE 11作為我們作業的主要瀏覽器，WebP 不能在上面作業（你們中的一些人可能已經知道了）
只是想知道是否有任何我可以使用的腳本或任何允許 IE 11 將 WebP 交換為 JPEG 的解決方法，比如我可以用來加載 JPEG 的 <!--[if (IE)]> ？
歡迎任何解決方案！只是想嘗試并確保我獲得所有瀏覽器的兼容性！
謝謝，對不起，這似乎是一個菜鳥問題！
uj5u.com熱心網友回復：
在 IE 11 中有兩種解決方案可以解決這個問題。
- 最簡單的方法是使用
<picture>元素。您可以設定 webp<source>和 jpeg<img>后備。瀏覽器將嘗試加載第一個兼容的。在 IE 中，它將加載 jpeg 檔案。在其他支持的瀏覽器中，它將加載 webp 檔案。
示例代碼：
<picture>
<source srcset="image.webp" type="image/webp">
<img src="image.jpeg" />
</picture>
- 您可以使用 polyfill webp-hero將 webp 格式轉換為 IE 11 支持格式。在其他支持 webp 的瀏覽器中，polyfill 不會運行。但是在 IE 11 中轉換需要一些時間。
示例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://unpkg.com/[email protected]/dist-cjs/polyfills.js"></script>
<script src="https://unpkg.com/[email protected]/dist-cjs/webp-hero.bundle.js"></script>
</head>
<body>
<img src="picture/landscape.webp" />
<script>
var webpMachine = new webpHero.WebpMachine()
webpMachine.polyfillDocument()
</script>
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/431573.html