今天小编跟大家讲解下有关前端webp图片 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关前端webp图片 的相关资料,希望小伙伴们看了有所帮助。
webp 是目前 Web 比较流行的解决方案,相对于 Jpeg/png, 基于 VP8 的压缩,有着非常不错的压缩率。
网络上有一款比较创新的检测方法,利用 canvas 输出图像的方式。
function canUseWebP() { var elem = document.createElement('canvas'); if (!!(elem.getContext && elem.getContext('2d'))) { // was able or not to get WebP representation return elem.toDataURL('image/webp').indexOf('data:image/webp') == 0; } // very old browser like IE 8, canvas not supported return false;}如果用到 背景图的话,我们可以通过跟元素的 class 来进行图片格式的选择来源:爱蒂网