重装农药第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. 在控制台下玩玩dotnet core内置原生的DI

    转载请注明出处:http://www.cnblogs.com/zhiyong-ITNote/ 在基于dotnet core的web开发中,我们会经常用到DI,那么如果单单使用dotnet core自身 ...

  2. 一个小demo 实用selenium 抓取淘宝搜索页面内的产品内容

    废话少说,上代码 #conding:utf-8 import re from selenium import webdriver from selenium.webdriver.common.by i ...

  3. Xamarin Essentials教程语音播报TextToSpeech

    Xamarin Essentials教程语音播报TextToSpeech   语音播报是一种将文本信息转化为音频信息的技术.使用该技术,开发者可以让用户不用盯着屏幕,就可以获取到信息.例如,支付宝为商 ...

  4. Word技巧【转载】

    Word谁都会用,高手和菜鸟最明显的区别就是效率,有人可以轻车熟路一小时做完好几份Word,有人加班到深夜手酸脖子疼还没做好一份,不管用什么办公软件,效率都是第一追求.先看第一点:   ❶如何快速选中 ...

  5. Java并发编程(十)-- Java中的锁

    在学习或者使用Java的过程中进程会遇到各种各样的锁的概念:公平锁.非公平锁.自旋锁.可重入锁.偏向锁.轻量级锁.重量级锁.读写锁.互斥锁.死锁.活锁等,本文将简概的介绍一下各种锁. 公平锁和非公平锁 ...

  6. Ubuntu下使用cmake生成可执行文件

    1.单个CPP文件的cmake 首先编写一个简单的程序(main.cpp): #include <iostream> using namespace std; int main() { c ...

  7. BZOJ2138 : stone

    根据Hall定理,若存在一个区间满足内部需求数$>$内部石子数,则不存在完美匹配. 由于区间互不包含,所以设: $a[i]$表示右端点$\leq i$的区间的容量之和. $b[i]$表示左端点$ ...

  8. JAVA笔记--static

    1.static 修饰变量 public class MyClass { static int i = 4; } 其中static 修饰变量,表示变量 i 属于 MyClass 类,所有的对象共享一个 ...

  9. DOM操作技术

    1.动态script function loadScript(url) { var script = document.createElement("script"); scrip ...

  10. react native webview 不能滑动页面

    用RN 写Android的时候,webview点击正常,但是不能滑动,或者滑动很艰难.调试不报错,inspect一切正常. 遍查网络无良方, 最后发现其他同事在最外层套了个这东西: Touchable ...