使用JQuery插件Jcrop进行图片截取】的更多相关文章

Jcrop插件本身并不含有图片截取功能,它仅仅是在前端层面构建一套截取动画效果并产生4个坐标点,插件使用者将这4个坐标点传回至服务器接口上进行截取操作.其优点是具有较高的通用性.浏览器兼容性(IE6+)及稳定性高,缺点是无法适用于手机H5开发(无图片缩放.拖拽效果). 最新版的Jcrop已更新到v3.0+了,本文基于 v0.9.12,由于这版本之间API及使用方式差异非常大,故本文不具备 Jcrop v3.0+ 的使用参考价值,请读者悉知. Jcrop V0.9+ 下载地址:http://dee…
一.插件功能 用于对图片进行修剪.但是在使用Jcrop时,还需要配合服务器端开发语言(如asp.net,php等)使用. 二.官方地址 http://deepliquid.com/content/Jcrop.html在官方地址中有5个demo,在这5个demo中,有3个带有代码说明.有1个提供了完整的实例,前端(js)与后台(php)交互,修剪图片并显示.而本次测试时,后台使用的是asp.net来修剪图片.在文章的下面有完整的测试代码可供下载.官方Demo也可以下载,但是下载下来的文件包含js代…
<Web 开发最有用的50款 jQuery 插件集锦>系列文章向大家分享最具创新的50款 jQuery 插件,这些插件分成以下类别:网页布局插件,导航插件,表格插件,滑块和转盘插件,图表插件,图片特效插件,视频插件等等,将陆续分享给大家,记得关注和收藏啊. 您可能感兴趣的相关文章 50款最有用的 jQuery 插件集锦<表单篇> 50款最有用的 jQuery 插件集锦<网页布局篇> 50款最有用的 jQuery 插件集锦<内容滑块篇> 50款最有用的 jQu…
1:引入相应的js文件  jquery.SuperSilder.js 2:HTML: 结构 注:此地加载图片的代码也可以从后台库中读取图片的集合列表,然后通过循环的方式显示出来 3:CSS 样式定义左右按钮 4:jQuery: 部分 5:实现效果 6:参数说明: bxSlider 详细配置参数:bxSlider有很多配置参数,使你能够用参数制作出各种各样的slider效果: 7:jquery.SuperSlide - 详情参数 http://down.admin5.com/demo/code_p…
Jcrop是一款优秀的裁剪工具,它不仅可以裁剪图像,还可以裁剪canvas及任何的div元素,具体可参考: http://code.ciaoca.com/jquery/jcrop/ 基于Jcrop,开发一个js组件(Cut.js),使之可进行复用: (function(jQuery,window,undefined){     window.Cut = window.Cut || {};     var _default={         boxWidth:0,         boxHeig…
此Jquery插件是在图片加载前显示一个加载图片,当图片下载完毕后显示图片出来,可对图片进行是否自动缩放功能,此Jquery插件使用时可让页面先加载,而图片后加载的方式,解决了平时使用时要在图片显示出来后才能进行缩放时撑大布局的问题   ///参数设置:scaling     是否等比例自动缩放width       图片最大高height      图片最大宽loadpic     加载中的图片路径   js插件代码:   /* **************图片预加载插件***********…
简要教程 cropper是一款使用简单且功能强大的图片剪裁jQuery插件.该图片剪裁插件支持图片放大缩小,支持鼠标滚轮操作,支持图片旋转,支持触摸屏设备,支持canvas,并且支持跨浏览器使用. cropper提供了大量的参数.方法和事件供图片的剪裁操作. 安装 可以通过Bower或NPM来安装该插件. 1 2 bower install cropper npm install cropper                使用方法 使用该图片剪裁插件首先要引入必要的js和css文件. 1 2…
网站的速度非常重要,现在有很多网站优化的工具,如 Google 的Page Speed,Yahoo 的 YSlow,对于网页图片,Yahoo 还提供 Smush.it这个工具对图片进行批量压缩,但是对于图片非常多的网站,载入网页还是需要比较长的时间,这个时候我们可以使用 Lazy Load 这个 jQuery 插件来延迟加载图片. Lazy loader 是一个延迟加载图片的 jQuery 插件,在一些图片非常多的网站中非常有用,在在浏览器可视区域外的图片不会被载入,直到用户将页面滚动到它们所在…
一.操作流程 会员点击头像设置,弹出一个层,在层中,有上传图片的按钮,用户点击按钮上传图片,图片在服务器端按大小压缩保存(方便剪切).保存后,在前端显示,然后用户可修剪图片.选择图片区域,点击提交,保存修剪后的图片,图片保存后在当前页面头像区域显示图片. 使用的插件有:弹出层使用lightbox_me插件,上传文件使用blueimp插件,切割图片使用Jcrop插件.插件的使用方法可以看下面的博文: 网站开发常用jQuery插件总结(16)图片修剪插件Jcrop网站开发常用jQuery插件总结(1…
头像裁剪是一个经常用到的功能,实现原理也较为简单,就是在本地选择好所需裁剪图片的坐标,将坐标发送到服务器,由服务器执行图片裁剪操作. jQuery插件Jcrop提供了强大的图片裁剪坐标选择插件.一下来介绍它的用法.本处采用了AJAX本地上传一张图片的方法让用户裁剪.很多验证没有做,因为作为一个关于Jcrop的例子,很多验证不如与本文研究的范畴.服务器端采用MVC3实现. 直接贴代码,详解注释里面有了. 一.前台页面代码. <link href="http://www.cnblogs.com…