另外还有用截图软件截图的,你可以下载一款在你手机上最好用的截图软件,安装后就可以使用截图功能了。答题不易,互相帮助,手机提问的朋友在客户端右上角评价点满意即可.
如果你认可我的回答,请点击采纳为满意回答按钮!
Clipic.js插件可以为移动端 (仅支持移动端) 提供头像上传并裁剪成指定尺寸,用原生js开发的,轻量级,包含html跟css,不到8kb。点此链接体验: https://teojs.github.io/clipic/
https://github.com/teojs/clipic
参数说明
width:Number (默认:500) – 裁剪宽度
height:Number (默认:500) – 裁剪高度
ratio:Number (可选) – 裁剪的比例,当传入ratio时width/height将无效
src:String (必传) – 需要裁剪的图片,可以是图片链接,或者 base64
type:String (默认:jpeg) – 裁剪后图片的类型,仅支持 jpeg/png 两种
quality:Number (默认:0.9) – 压缩质量
buttonText:Array (默认:[‘取消’, ‘重置’, ‘完成’]) – 底部三个按钮文本
http://bbs.itying.com/topic/5cb17892c6a71b10bcef96b0
拖拽的过程就不说了,这里主要说一下如何在前端获取到图片的相关信息。
html5里有一个fileReader的全局变量,用来读取本地文件,比如txt,img等,下面是一个简单的代码。
function checkFile(files){var file = files[0]
var reader = new FileReader()
// show表示<div id='show'></div>,用来展示图片预览的
if(!/image\/\w+/.test(file.type)){
show.innerHTML = "请确保文件为图像类型"
return false
}
// onload是异步 *** 作
reader.onload = function(e){
show.innerHTML = '<img src="'+e.target.result+'" alt="img">'
}
reader.readAsDataURL(file)
}
这样就能够在不上传到服务器的前提下预览图片。当然,这个问题的重点是获取图片的原始尺寸,html5里还提供了两个变量来获取:naturalWidth和naturalHeight,这两个分别来获取图片的原始宽度和原始高度。
在上面的例子中,就能通过下面的方式获取到:
var width = e.target.naturalWidthvar height = e.target.naturalHeight
还有一种情况就是,如果已经存在页面里的图片,怎么获取到原始尺寸呢,可以这样:
var img = document.getElementsByTagName('img')[0] // 获取到图片var width = img.naturalWidth
var height = img.naturalHeight
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)