使用HTML5的两个api，前端js完成图片压缩
主要用了两个html5的 API，一个file，一个canvas，压缩主要使用cnavas做的，file是读取文件，之后把压缩好的照片放入内存，最后内存转入表单下img.src，随着表单提交。
照片是自己用单反拍的，5M多，压缩下面3张分别是600多kb，400多kb，300kb的最后那张失真度很大了，压缩效率蛮高的。
。。。。。(代码请查看原文)
使用HTML5的两个api，前端js完成图片压缩的更多相关文章
- 利用HTML5，前端js实现图片压缩
http://blog.csdn.NET/qazwsx2345/article/details/21827553 主要用了两个HTML5的 API,一个file,一个canvas,压缩主要使用cnav ...
- 前端JS转图片为base64并压缩、调整尺寸脚本
image to base64 to blob //////////////////////////////////////////////////////////////////////////// ...
- js/vue图片压缩
js版 新建compressImage.js,内容如下: // 将base64转换为blob(有需要可加上,没需要可不加) function convertBase64UrlToBlob(urlDat ...
- js框架Modernizr是什么东西？ 他是前端开发HTML5和CSS3的强有力前端js检测类库
最近在研究modernizr的前端框架,发现这个Modernir对前端写页面非常友好,并且能够很快的建立起适应任何设备的html页面哦.在这里分享下基础教程,让大伙对modernizr是什么?做什么用 ...
- js 实现图片压缩并转换成base64(data:image/jpeg;base64)格式
<!DOCTYPE html> <html> <head> <!--by 0o晓月メ http://www.cnblogs.com/final-elysion ...
- js canvas图片压缩
function preview_picture(pic){ var r=new FileReader(); r.readAsDataURL(pic); r.onload=function(e){ d ...
- HTML5 file API加canvas实现图片前端JS压缩并上传
一.图片上传前端压缩的现实意义 对于大尺寸图片的上传,在前端进行压缩除了省流量外,最大的意义是极大的提高了用户体验. 这种体验包括两方面: 由于上传图片尺寸比较小,因此上传速度会比较快,交互会更加流畅 ...
- 前端Js框架汇总
概述: 有些日子没有正襟危坐写博客了,互联网飞速发展的时代,技术更新迭代的速度也在加快.看着Java.Js.Swift在各领域心花路放,也是煞是羡慕.寻了寻.net的消息,也是振奋人心,.net co ...
- HTML5 postMessage 和 onmessage API 具体应用
HTML5 postMessage 和 onmessage API 具体应用 随着 HTML5 的发展.了解并熟悉 HTML5 的 API 接口是很重要的.postMessage(send) 和 on ...
随机推荐
- 使用Jedis
前言 借助Jedis可以在Java上操作Redis. Jedis 到https://mvnrepository.com/去找jar包下载即可. 如果是maven项目: <!-- https:// ...
- bWAPP练习--injection篇SQL Injection (GET/Search)
SQL注入: SQL注入,就是通过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的SQL命令.具体来说,它是利用现有应用程序,将(恶意)的SQL命令注入到 ...
- python的进阶--爬虫小试
代理之说 [ python实现代理服务功能实例 ] -- https://www.jb51.net/article/43266.htm [检测代理是否有效] -- https://blog.csd ...
- POJ 3228 [并查集]
题目链接:[http://poj.org/problem?id=3228] 题意:给出n个村庄,每个村庄有金矿和仓库,然后给出m条边连接着这个村子.问题是把所有的金矿都移动到仓库里所要经过的路径的最大 ...
- CSS 笔记——阴影、圆角、旋转、光标
7. 阴影.圆角.旋转.光标 (1)box-shadow 阴影 基本语法 text-shadow: h-shadow v-shadow blur color; box-shadow: h-shadow ...
- bzoj 3585: mex && 3339: Rmq Problem -- 主席树
3585: mex Time Limit: 20 Sec Memory Limit: 128 MB Description 有一个长度为n的数组{a1,a2,...,an}.m次询问,每次询问一个区 ...
- bzoj 1670: [Usaco2006 Oct]Building the Moat护城河的挖掘 -- 凸包
1670: [Usaco2006 Oct]Building the Moat护城河的挖掘 Time Limit: 3 Sec Memory Limit: 64 MB Description 为了防止 ...
- asp.net 链接数据库ADO.NET
web.config <configuration> <connectionStrings> <add name="constr" connectio ...
- lua学习：lua中“类”的实现
在之前的面试遇到考用lua实现类的题目.现在就补补这块知识点. 我们都知道Lua中的table是一个对象.拥有状态,拥有self,拥有独立于创建者和创建地的生命周期. 一个类就是一个创建对象的模具.L ...
- windows服务与计划任务
1. 打开Visual Studio 2012新建一个project Solution: 2. 选择Windows->windows Service,修改服务名称:MyFirstService: ...