700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > webp的js插件_让浏览器全面兼容WebP图片格式

webp的js插件_让浏览器全面兼容WebP图片格式

时间:2024-03-19 00:35:01

相关推荐

webp的js插件_让浏览器全面兼容WebP图片格式

WebP格式

WebP是Google推出的一种图片格式,它基于VP8编码,可对图像大幅压缩。与JPEG相同,WebP也是一种有损压缩,但在画质相同的情况下,WebP格式比JPEG图像小40%。

Wiki

百度百科

它是一个开源项目,我们可以在此获取其中源码,以及相关工具。

浏览器支持

显然,Google浏览器Chrome首先引入,此外Opera 11.10也增加对WebP的支持。

如果你能看见下面的图片,说明你的浏览器支持WebP。

支持更多的浏览器!

WebP的优势显而易见,但缺少主流浏览器的支持,使得它目前仍然无法推广。但这并不妨碍我们尝试!

大多数浏览器自身无法解码WebP格式,但可以交给我们来实现!虽然网页脚本无法胜任,但借助Flash技术,我们完全可以实现高效快速的解码。

并且,几乎所有的浏览器都支持Flash...

WebP插件

当前版本共3个文件: WebP.js , WebP.swf 和 WebP.htc。在此下载打包文件。

之间插入如下代码,即可使用WebP了。

插件将会捕捉页面中使用WebP格式的img元素,并用Flash进行替换。图像的解码及显示都在Flash中完成,因此目前版本对CSS设置的背景图片无效。

当然,作为JPEG格式的替换,只有对较大的图像使用才有意义,否则过多的解码将消耗大量的资源。

Demo1:最简单的样列

Demo2:保留原始属性

Demo3:保留原始样式

img

{

filter: alpha(opacity=50);

opacity: 0.5;

}

.t

{

border: blue dotted 2px;

}

Demo4:支持动态载入

var d = document.getElementById("con");

function add()

{

d.innerHTML = "";

}

function del()

{

d.innerHTML = "";

}

载入

移除

本文转自:/WebP/

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。