我试图设置picturefill.js来传送响应式图像。当我使用srcset属性而不是src属性来避免双重下载时,默认图像alt文本会在picturefill.js有机会呈现正确的图像之前一直显示。
<!DOCTYPE html>
<html lang="en">
<head>
<script>document.createElement( "picuture" );</script>
<script async src="js/picturefill.min.js"></script>
</head>
<body>
<picture>
<source srcset="desktop.jpg" media="(min-width: 768px)">
<img srcset="mobile.jpg" alt="...">
</picture>
</body>
</html>
我只是想知道这是否是一个已知问题以及是否有解决方法。我测试过的3个设备中只有1个不完全支持图片元素(如果我使用src属性,他们会获得双重下载)并不会显示带有srcset属性的替代文字;就是我快速的iPhone 6;我的慢速iPhone 4和iPad 1显示替代文字,我只是想知道它是否只是设备的速度,使它看起来不显示。
我见过人们谈论有关使用picturefill.js的唯一真正缺点就是省略src属性以避免双重下载,留下那些没有javascript的默认图片alt text - nothing关于温度。在脚本编写完成时呈现alt文本,这几乎与双重下载一样糟糕或更糟。