html5 调用手机摄像头图片按比例压缩上传前后台例子

利用html5调用本地摄像头拍照上传图片转 2016-04-25

利用html5调用本地摄像头拍照上传图片转
利用html5调用本地摄像头拍照上传图片    html5概念啥的就不废话了,不知道的 百度, 谷歌一堆..今天学了学html5中的Canvas结合新增的<video>标签来获取本地摄像头,在html5之前,要在浏览器获取本地摄像头只有通过插件(ActiveX,但是这种只有IE支持)或者是flash来获取(或许你没学过flash那就很坑爹了),在之后微软的silve ...

纯原生js移动端图片压缩上传插件 2015-07-06

纯原生js移动端图片压缩上传插件
前段时间,同事又来咨询一个问题了,说手机端动不动拍照就好几M高清大图,上传服务器太慢,问问我有没有可以压缩图片并上传的js插件,当然手头上没有,别慌,我去网上搜一搜. 结果呢,呵呵...诶~又全是基于jquery.zepto的(这句话似乎吐槽次数太多了...),然后我也就不吐槽了, 然后当然是自己做了,先上图: 纯原生js的移动端图片压缩上传插件,不依赖任何库 用法 在html ...

利用Jquery使用HTML5的FormData属性实现对文件的上传 2016-04-04

1.利用Jquery使用HTML5的FormData属性实现对文件的上传 在HTML5以前我们如果需要实现文件上传服务器等功能的时候,有时候我们不得不依赖于FLASH去实现,而在HTML5到来之后,我们很容易的实现对文件的上传,只需要利用HTML5的一个FormData属性,结合Jquery就很容易实现文件的上传,而且读取文件的上传进度,下面这个上传案例就是基于上面所说的实现的,下面我将所所有的JS和CSS以及HTML页面代码放在下面. 注意事项:FormData属性必须依赖于HTML5,所以如

深入研究HTML5实现图片压缩上传 2016-04-09

深入研究HTML5实现图片压缩上传
上篇文章中提到移动端上传图片,我们知道现在流量还是挺贵的,手机的像素是越来越高,拍个照动不动就是好几M,伤不起.虽然客户端可以轻轻松松实现图片压缩再上传,但是我们的应用还可能在浏览器里面打开,怎么办呢,图片压缩.受以前PC上的开发思维影响,尼玛js哪有权限去操作文件,哪有资格压缩图片啊,搞不了,你们客户端去整吧.只能说自己还是有些井底之蛙了.在HTML5的影响下,前端能干的事情 ...

记录magento通过csv文件与zip(图片压缩)上传产品到数据库的过程 2016-03-08

记录magento通过csv文件与zip(图片压缩)上传产品到数据库的过程
1,前台使用input-file type按钮提交文件到magento指定的控制器,controllers获取.csv文件,因为magento是在zend框架上实现的,可以使用如下代码获取文件的上传信息: 1 /** 2 * New zend File Uploader 3 */ 4 $uploadsData = new Zend_File_Transfer_Adapter_H ...

前端图片预览,上传前预览,兼容IE7、8、9、10、11,Firefox,Chrome 2015-09-24

在现在的Web开发中不可避免的会做一个图片预览的功能,比如在上传图片的情况下,一个很简单的办法就是讲图片上传至服务器之后,再将文件的URL返回回来,然后异步通过这个URL加载刚刚上传的图片,实现图片的预览,很明显的在这个过程中两次Web请求,一次发送文件,一次下载文件,到最后这个文件如果在客户端被删除(取消上传,弃用这次的上传),这整个过程都白费了.我们希望能够在图片上传之前就能进行图片的预览,这样就避免了不必要的网络请求和时间等待.下面的内容就围绕这个话题展开. 本地图片预览 IE中的本地图片

HTML5拖放draganddrop与plupload的懒人上传 2015-06-26

HTML5拖放能够将本地的文件拖放到页面上,plupload又是很好的文件上传插件,而今天就将两者结合,做了个文件拖拽上传的功能. 简述HTML5拖放 拖放是HTML5标准的一部分,任何元素都能够拖放,也能够将本地的文件拖放到页面上. 设置元素可拖放 为了使元素可拖动,把 draggable 属性设置为 true <img draggable="true" /> 拖放事件 有7个拖放事件可以捕获,如下: dragstart:开始拖元素触发 dragenter:元素拖进可dr

HTML5+flash打造兼容各浏览器的文件上传方案 2015-08-09

HTML5+flash打造兼容各浏览器的文件上传方案
上一篇文章介绍了HTML5版的文件上传插件,相比flash,采用HTML5的新技术无疑可以提升程序的加载速度.但是在目前的情况看来,HTML5的特性支持度不高,插件的可用性范围确实比较窄.例如,我在插件中使用到的新特性有: <input type="file' />标签的multiple属性 File和FileList API XMLHttpRequest ...

教你如何调用百度编辑器ueditor的上传图片、上传文件等模块 2015-12-13

出于兴趣爱好,前段时间自己尝试写了一个叫simple的cms,里面使用了百度ueditor编辑器,发现它的多图片上传模块很不错,用起来很方便,又可以选择已经上传好的图片.正好我又是个懒人,发现有现成的自己就不想新开发了.于是我就想,是不是可以调用这个上传模板为自己所用呢? 有了这个想法后,我就到网上查阅资料,可惜资料少的可怜,都不能很好解决我的问题.于是觉得还是自己动手丰衣足食,皇天不负苦心人,终于摸索出解决方法,现在分享出来,和自己有同样想法的小伙伴. 代码如下: <html> <he

图片裁剪和异步上传插件--一步到位记录 2015-08-05

图片裁剪和异步上传插件--一步到位记录
图片上传裁剪这功能随处可见,有的自己写,不过太耗费时间了,插件的话感觉好多,前段时间就想挑一款好的插件,以后就用那款,可是挑了几款插件用上去,效果很好,问题就出在合并了,单一的插件效果是很好的,没问题,不然人家也不用吃饭了,可是当我把这几款插件合并一起用的时候就各种奇怪的问题出来了,决解了一个又跑出一个来了,最后挑了好半天发现了一款还好用的,就赶紧的记录下来了,不然以后要用又要 ...

前端图片预览,上传前预览,兼容IE7、8、9、10、11,Firefox,Chrome(学习到的知识) 2016-04-26

前端图片预览,上传前预览,兼容IE7、8、9、10、11,Firefox,Chrome(学习到的知识)
文章地址:http://www.cnblogs.com/rubylouvre/p/4597344.html 一.window.URL 在Chrome中,window.URL和window.webkitURL都存在 在Firefox中,仅Window.URL存在  在IE11(Edge),10中仅window.URL存在 在IE7.8.9中不存在window.URL 在IE中能通 ...

javascript实现图片预览未上传到服务器端 2014-08-09

javascript实现图片预览未上传到服务器端
1,图片预览 越来越多的浏览器为了安全,都不能获得文件的,全路径,实现图片预览实现起来有点麻烦.有人选择复制图片到服务器的某个路径下,然后从服务器端找到路径,实现预览.但这不是最佳实现方案,如果用户一张一张的预览图片,最终服务器里的垃圾图片岂不泛滥了?2,代码(以下代码兼容主流浏览器,请放心使用)图片预览 选择文件 : 文件名 : 3,附件附件部分是图片占位符和html代码,仅 ...

html5图片上传,支持图片预览、压缩、及进度显示,兼容IE6+及标准浏览器 2016-01-02

html5图片上传,支持图片预览、压缩、及进度显示,兼容IE6+及标准浏览器
以前写过上传组件,见 打造 html5 文件上传组件,实现进度显示及拖拽上传,兼容IE6+及其它标准浏览器,对付一般的上传没有问题,不过如果是上传图片,且需要预览的话,就力有不逮了,趁着闲暇时间,给上传组件添加了单独的图片上传UI,支持图片预览和缩放(通过调整图片的大小以实现图片压缩). 上传组件特点 轻量级,不依赖任何JS库,核心代码(Q.Uploader.js)仅约700行 ...

wordpress3.8.1上传中文文件名图片方法 2014-03-01

wordpress 3.8.1分享 http://pan.baidu.com/s/1pJ4lTJ9打开wp-admin/includes/file.php文件找到wp_handle_upload这个函数,按照下面的代码进行修改.主要添加两行在搜索到"function wp_handle_upload( &$file, $overrides = false, $time = null ) {"找到下面两行,并在每行前面添加//    //Move the file to the

FLEX图片预览上传 2013-01-10

这些天正在研究flex图片预览上传功能,于是找了一些资料进行了整理,形成了比较完整的示例,在此给自己留下参考资料. 需要以下两个jar包:commons-fileupload-1.2.jar和commons-io-1.4.jar 上代码,flex代码 import flash.events.*; import mx.controls.Alert; import mx.events.CloseEvent; import mx.managers.CursorManager; private var

从web编辑器UEditor中单独提取图片上传,包含多图片单图片上传以及在线涂鸦功能 2015-07-10

从web编辑器UEditor中单独提取图片上传,包含多图片单图片上传以及在线涂鸦功能
UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码.(抄的...) UEditor是非常好用的富文本web编辑器,而且全中文API和注释,方便学习和使用.特别是图片上传查看及涂鸦功能极为喜欢,但是有很多情况我们并不需要Web编辑器,而只需要图片上传.那么问题来了,提取图片上传哪 ...

Asp.NetMvc使用WebUploader多图片上传 2016-02-09

来博客园有一个月了,哈哈.在这里学到了很多东西.今天也来试着分享一下学到的东西.希望能和大家做朋友共同进步.       最近由于项目需要上传多张图片,对于我这只菜鸟来说,以前上传图片都是直接拖得控件啊,而且还是一次只能传一张.由于现在 项目用的是MVC,像Asp那样 拖控件 是不现实了.在我脑海中立刻就浮现出一个想法,网上一定有插件,哈哈.去网上一搜索,哇哦这么多.在众多的插件中我被百度的WebUploader吸引了.官网上写着:"WebUploader是由Baidu WebFE(FEX)团队

文件上传和下载及图片水印制作 2011-10-05

图片水印制作步骤:1.创建ImageIcon对象,加载图片2.创建虚拟画布BufferImage3.获取画笔getGraphoics()4.绘制图片5.如何是相应在服务器端则必须设置响应格式 response.setContextType("image/png") 默认为("text/html") 其作用是提示浏览器返回的是一张图片6.使用ImagIo.write() 输出图片水印制作代码实例://a. 创建ImageIcon对象 ImageIcon icon =
一周排行
  • 实现两级下拉框的联动
    1.实现两级下拉框的联动.   功能:实现点击年级下拉框,加载对应科目的下拉框. 第一步: ...
  • vNext之旅1:从概念和基础开始
    ASP.NET vNext or .NET vNext?   vNext在曝光以来绝大多数 ...
  • IT生活与工作
       生活,生活是一种态度,讲究规律地去生活:不要那种错综杂乱的生活节奏,每一天都在和时间 ...
  • 一般来说,目前新版的 Linux 预设可以支持的网络卡芯片组数量已经很完备了,很多网络卡芯片都已经被支持,例如RLT 8139 芯片 ( RealTek 8139 ) 的网络卡所以使用者可以很轻易的设定好他们的网络卡 ...
  • 今日通过shell上执行esxcli命令,学习了esxcli 相关参数,可以esxcli vm操作虚拟机启动关闭等,查看系统相关情况及设置esxcli system welcomemsg set -m 'lys',还 ...
  • MyEclipse2016CI1支持远程WebSphere连接器
    MyEclipse 2016 CI 1有很多Web开发者会喜欢的新功能,包括Live Pr ...
  • 我们知道,javascript是一种泛类型的语言.泛类型意味着不必显式定义变量的数据类型.事实上,我们无法在 javascript 上明确地定义数据类型.而只能通过var语句显示声明变量:var myvar;或这样隐 ...
  •     最近在一些微软的vdi项目中,在做完微软的桌面虚拟化设置后,发现用户的体验,特别是在使用Auto CAD,Photoshop 等图形类应用软件时,不单单在图形上有一定的色差,而且操作上体验相对于本机确实有点差 ...
  • linux内存占用过高原因
    今天服务器装了个lnmp环境,看了下那个探针,发现内存占用97%,瞬间吓尿了.google ...
  • 企业管理器--管理--SQL Server代理--右键作业--新建作业--"常规"项中输入作业名称--"步骤"项--新建--"步骤名"中输入步骤名--&qu ...