使用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 ...
随机推荐
- [BZOJ4888][TJOI2017]异或和(树状数组)
题目描述 在加里敦中学的小明最近爱上了数学竞赛,很多数学竞赛的题都是与序列的连续和相关的.所以对于一个序列,求出它们所有的连续和来说,小明觉得十分的简单.但今天小明遇到了一个序列和的难题,这个题目不仅 ...
- 【最大化平均值】POJ3111-K Best
[题目大意] 给出v[]和w[],求的最大值. [思路] 二分s(S)的值,可变形为s(S)*Σw>=Σv,所以只需要把求出x*w[i]-v[i],看看前k个的和是否大于等于0,大于等于0就满足 ...
- Redis 锁的实现方案
开发中不可避免的是碰到并发请求,在数据严谨性的要求不高时,我们也不需要做什么处理,但如果碰到数据严谨性非常高的时候(例如:用户金额,秒杀产品的库存...),我们就需要慎重处理了. 解决方案多种多样,下 ...
- [bzoj1017][JSOI2008]魔兽地图 DotR (Tree DP)【有待优化】
Description DotR (Defense of the Robots) Allstars是一个风靡全球的魔兽地图,他的规则简单与同样流行的地图DotA (Defense of the Anc ...
- bzoj 2815 灭绝树
对于一个食物网(一个DAG),一个物种死亡后,某些物种就必然死亡,求出必然死亡的是那些物种. 灭绝树的另一种含义是:“灭绝树跟节点到节点u的路径上的节点由那些原图中从根节点到节点u的所有路径中都经过了 ...
- Struts+Hibernate+Spring常见问题
http://wanglihu.iteye.com/blog/1897718 1.java.lang.NoClassDefFoundError: org/objectweb/asm/ClassVisi ...
- SEAndroid安全机制简要介绍和学习计划
与iOS相比.Android最被人诟病的是其流畅性和安全性. 然而,从4.0開始,Android不遗余力地改善其流畅性. 特别是在即将公布的L版本号中,用ART替换了Dalvik,相信会越来越流畅.至 ...
- 电脑硬件天梯图—CPU、显卡、主板
看到许多玩家对电脑的配置一点都不懂,这里特地制作了最新的硬件天梯图--CPU,显卡,主板,让大家对电脑硬件孰优孰劣有个一目了然的了解. 看不清楚的情点击小图看大图. 首先是CPU天梯图: 其次是显卡天 ...
- VMware 11.0 简体中文版|附永久密钥
20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送) 国内私募机构九鼎控股打造,九鼎投资是在全国股 ...
- OPENGL架构
第2章 OpenGL 简介 每台计算机都有专门处理图形的硬件,它们控制着屏幕上显示的内容.OpenGL向这种硬件发出命令,告诉它们执行什么操作.计算机游戏或者其他任意软件借助制造商提供的设备驱动程序, ...