js如何将gif图片分解拆开变成静态图片
大家都知道gif的可以从视频、照片、摄像头中的创建gif动画,那么gif动画如何逆向拆成单个图片呢,以前我们需要用到后端的库,如何java中的GifDecoder ,php中的GifFrameExtractor,那么有没有办法在浏览器中通过js来拆解gif呢,有,今天我们来试试js来拆解gif
今天用到的js库就是libgif,这是一个很强大的库,可以对gif动画进行播放控制,提取帧数据
下面就是一个示例,可以直接在线运行和编辑
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>BFW NEW PAGE</title> <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script> <script type="text/javascript"> bready(function() { use(["libgif"], function() { document.querySelector("#input").onchange= function() { var gifImg = document.createElement('img'); // gif库需要img标签配置下面两个属性 gifImg.setAttribute('rel:animated_src', URL.createObjectURL(this.files[0])) gifImg.setAttribute('rel:auto_play', '1') var sup1 = new SuperGif({ gif: gifImg }); ...
点击查看剩余70%
网友评论0