重装农药第16天！！

jquery裁剪图片插件cropit示例

背景：做的手机网页项目，用html file控件上传图片，有些手机拍照后图片会很大，20M以上的，用之前的H5 formdata上传的话有时会非常慢的，就想着能不能在选择图片的时候直接在客户端处理下，把选择的图片按规格的大小裁剪掉，上网搜索了一下，发现cropit这个玩意，自己FQ进官网下载示例弄了下，成功实现想要的功能

原图：25M

裁剪后：175K

http://blog.niunan.net/jquery_caijian/index.html
源码下载：
http://image.niunan.net/jq%E8%A3%81%E5%89%AA%E6%8F%92%E4%BB%B6cropit%E7%A4%BA%E4%BE%8B.7z

jquery裁剪图片插件cropit示例的更多相关文章

  1. cropper(裁剪图片)插件使用（案例）

    公司发布微信H5前端阵子刚刚弄好的H5端的图片上传插件,现在有需要裁剪图片.前端找了一个插件---cropper 本人对这插件不怎么熟悉,这个案例最好用在一个页面只有一个上传图片的功能上而且只适合单个 ...

  2. 支持移动端裁剪图片插件Jcrop（结合WebUploader上传）

    (此教程包括前端实现图片裁剪,后端进行获取裁剪区并保存) 最近有一个需求,微信公众号上传图片,支持自定义裁剪. 以前用过一款裁剪插件cropper,很久没用了,不知道对移动端操作兼容如何,重新从网上搜 ...

  3. jquery压缩图片插件

    imageCompress 只有图片压缩功能,比较简单jquery.imageCompress.js 使用说明: el:为上传框 quality:压缩图片质量,单位为% onloadStart:读取图 ...

  4. jquery.query.js 插件（示例及简单应用）

    帮助文档 var url = location.search; > "?action=view&section=info&id=123&debug&te ...

  5. jquery.query.js 插件（示例及简单应用） —— html之间传值

    帮助文档 var url = location.search; > "?action=view&section=info&id=123&debug&te ...

  6. Java+jquery实现裁剪图片上传到服务器

    大体分两步: 1.利用jquery裁剪图片,把裁剪到的几个点传入后端 2.利用前端传入的几个点,来裁剪图片 首先,用到一个jquery的插件 imgAreaSelect 实例及插件下载地址:http: ...

  7. 18款 非常实用 jquery幻灯片图片切换

    1.jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动 jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果,带索引按钮控制和左右按钮控制图片切换. 查看演示>& ...

  8. 利用jquery的imgAreaSelect插件实现图片裁剪示例

    http://www.cnblogs.com/mizzle/archive/2011/10/13/2209891.html 将用户上传的图片进行裁剪再保存是现在web2.0应用中常常处理的工作,现在借 ...

  9. jquery photoClip支持手机端,PC端 本地裁剪图片后上传插件

    支持手机,PC最好的是jquery photoClip插件,下载地址&示例:https://github.com/topoadmin/photoClip demo.html 代码: <! ...

随机推荐

  1. Web Component

    前言 Web Component不是新东西,几年前的技术,但是受限于浏览器兼容性,一直没有大规模应用在项目里,直到现在(2018年年末),除IE仍不支持之外,其它主流浏览器都支持Web Compone ...

  2. CSS-选择器权重计算

    权重计算规则 内联样式,如: style=" ",权值为1000. ID选择器,如:#content,权值为0100. 类,伪类和属性选择器,如.content,权值为0010. ...

  3. Android自定义View前传-View的三大流程-Measure

    Android自定义View前传-View的三大流程-Measure 参考 <Android开发艺术探索> https://developer.android.google.cn/refe ...

  4. atom那些事儿

    基于electron(Electron 的底层基于Chromium 和node.js)

  5. 搭建vue脚手架---vue-cli

    vue-cli作为一款mvvm框架语言(vue)的脚手架,集成了webpack环境及主要依赖,对于项目的搭建.打包.维护管理等都非常方便快捷.我们在开发项目时尤其需要这样一个快速构建项目的工具. 以下 ...

  6. 通过按键实现LED灯的亮灭（含两种情况）

    #include "stm32f10x.h"// 相当于51单片机中的 #include <reg51.h> #include "stm32f10x_gpio ...

  7. Lubuntu安装屏幕键盘onboard，使触摸屏可以登录和输入

    Lubuntu18.04 LTS桌面使用 LightDM 显示管理器,默认已经安装了GTK+ 欢迎界面 需要的话可以下列命令安装使用 $ sudo apt-get install lightdm-gt ...

  8. Luogu 2018 秋令营 Test 2

    T1: 题目描述 你正在使用过时的浏览器,洛谷暂不支持. 请 升级浏览器 以获得更好的体验! Bob 来到了一个 $n \times m$ 的网格中,网格里有 $k$ 个豆子,第 $i$ 个豆子位于 ...

  9. 记一次linux服务部署

    虽然很简单,但是还是想记录一下: 准备一台云主机并连接到云主机上 因为是 springboot 项目,采用了前后端分离部署.所以就没有使用 Tomcat.为应用程序创建文件夹. 添加启动脚本 star ...

  10. Error: Invalid or corrupt jarfile

    使用IDEA通过MAVEN创建quickstart项目后,添加了Artifacts,发现生成的jar包无法run,出现下面的错误: Error: Invalid or corrupt jarfile ...