gif.js实现在浏览器中多张照片合成gif动图效果代码
代码语言:html
所属分类:其他
代码描述:gif.js实现在浏览器中多张照片合成gif动图效果代码
代码标签: gif.js 浏览器 多张 照片 合成 gif 动图
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <h1>待合成gif的四张图</h1> <div class="images"> <img id="img1" src="/asset/logo.png" /> <img id="img2" src="/asset/startBt.jpg" /> <img id="img3" src="/asset/yanzhengma.png" /> </div> <h1>合成后</h1> <div> <img id="gifresult" /> </div> <script type="text/javascript" src="/asset/gif.js"></script> <script type="text/javascript"> // console.log(gifs); var gifs = new GIF({ workers: 2, quality: 10, workerScript: '../asset/gif.worker.js', width:200, height:200 }); // add a image element // console.log(gifs); var img1 = document.querySelector('#img1'); var img2 = document.querySelector('#img2'); var img3 = document.querySelector('#img3'); gifs.addFrame(img1, { d.........完整代码请登录后点击上方下载按钮下载查看
网友评论0