当前位置:首页 » 文件管理 » jquery上传头像裁剪

jquery上传头像裁剪

发布时间: 2022-06-24 17:50:23

A. 求javascript裁剪头像代码 简单一点的 只需要进行拖拽操作获取到坐标和宽高 我自己另外写ajax函数提交

剪头像:
<script type="text/javascript" language="javascript">
<!--
//关于图片处理
var _cutMinW=48; //切片最小宽度
var _cutMinH=48; //切片最小高度
var _imgPath=getCookie('162100screenshotsImg'); //图片路径

function getCookie(name){
var arr=document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr!=null && arr!=false) return decodeURIComponent(arr[2]);
return false;
}

function startP(){
//alert('示例图片已载入,此键暂不必用');
location.href="start.html";
}

function subCut(){
/*
alert('\
图片实际宽度为'+Math.ceil(_imgW)+'px\n\
图片实际高度为'+Math.ceil(_imgH)+'px\n\
图片当前宽度为'+Math.ceil(_nowW)+'px\n\
图片当前高度为'+Math.ceil(_nowH)+'px\n\
截图X坐标为'+Math.ceil(_pP.offsetWidth+1-_imgO.offsetLeft)+'px\n\
截图Y坐标为'+Math.ceil(_pP.offsetHeight+1-_imgO.offsetTop)+'px\n\
截图宽度为'+Math.ceil(_pO.offsetWidth-2)+'px\n\
截图高度为'+Math.ceil(_pO.offsetHeight-2)+'px\n\
可将上述参数,转向后台处理。');
*/
if(!_imgW || !_imgH || _imgO==null){
alert('图片加载出错!');
return false;
}
var f=document.createElement("form");
f.action="i_up.php";
f.method="post";
f.style.display='none';
f.innerHTML='\
<input type="hidden" name="imgw" value="'+Math.ceil(_imgW)+'" />\
<input type="hidden" name="imgh" value="'+Math.ceil(_imgH)+'" />\
<input type="hidden" name="noww" value="'+Math.ceil(_nowW)+'" />\
<input type="hidden" name="nowh" value="'+Math.ceil(_nowH)+'" />\
<input type="hidden" name="px" value="'+Math.ceil(_pP.offsetWidth+1-_imgO.offsetLeft)+'" />\
<input type="hidden" name="py" value="'+Math.ceil(_pP.offsetHeight+1-_imgO.offsetTop)+'" />\
<input type="hidden" name="pw" value="'+Math.ceil(_pO.offsetWidth-2)+'" />\
<input type="hidden" name="ph" value="'+Math.ceil(_pO.offsetHeight-2)+'" />\
<input type="hidden" name="ptype" value="4" />\
';
document.body.appendChild(f);
document.getElementById('runSub').style.display='block';
f.submit();
}
-->
</script

B. jQuery这样“$.自定义”,是个什么操作

lz上过sns网站或者论坛之类的吗,看上面的上传头像然后剪切大小,都是用flash来完成的。
如果用jquery的图片剪切插件,就可以不用flash 用js来完成。这种是复杂型的,虽然自己也能做但是要花时间,用现成的插件省去了不少写代码的时间。
基本上自定义插件都是省去写代码的时间而已,改下参数只能用。
我觉得用自定义插件就是解决时间问题,增加开发速度

C. asp.net c# 图片裁剪上传的功能实现

这段是jQuery的代码。
如果你想获取客户端的图片路径是不可以的。这是出于对客户端的安全保护。
你必须把客户端的图片保存到服务器上,还后再在服务器上进行图片处理。

src: 'images/lulu.jpg',//找到图片
这行代码的图片路径,应该是你的服务器保存的图片的路径。

D. jQuery,croppic(用户截图后上传功能)的使用方法

它是前台剪切后,发回剪切的图片数据到后台,然后后台将该数据保存为图片,并生成一条引用链接给前台就行了。

E. thinkphp3.1头像剪切上传怎么把jquery剪切好的图片上传保存到数据库

canvas
转成
base64位,然后得到图片的编码,然后上传到数据库

F. 在论坛上传头像时要先选择本地文件,然后上传,进行裁剪后保存。

只要上传提示成功过,服务器上就会存在,除非人为删除了

G. html5+js怎么实现手机头像上传,可裁剪

抱歉
这个已经不属于HTML+JS的内容了。
最常用的是.NET和PHP,这两个都有现成的模版可以下载。

H. 如何用CropBox实现头像裁剪并与java后台交互

主流的前端jQuery 图像裁剪插件有Jcrop和CropBox,前者是将原图和需要裁剪的参数(裁剪的各点坐标,旋转角度等)传到后台,然后由后台完成实际的裁剪和后续操作。
CropBox实现功能相对较少,但操作更简单,它的原理是:
将裁减后的图片通过base64编码,然后转化为blob格式发送到服务器,服务器完成解码即可,官网介绍可以看github上的说明和Demo
核心js函数只有两个:
getDataURL 将裁剪后的图片简单以base64编码后的结果,用于实时预览,当然也可以将它直接传到服务器,然后解码为png格式
getBlob 上传图片为Blob格式

首先贴出两个函数的源码
getDataURL: function ()
{
var width = this.thumbBox.width(),
height = this.thumbBox.height(),
canvas = document.createElement("canvas"),
dim = el.css('background-position').split(' '),
size = el.css('background-size').split(' '),
dx = parseInt(dim[0]) - el.width()/2 + width/2,
dy = parseInt(dim[1]) - el.height()/2 + height/2,
dw = parseInt(size[0]),
dh = parseInt(size[1]),
sh = parseInt(this.image.height),
sw = parseInt(this.image.width);

canvas.width = width;
canvas.height = height;
var context = canvas.getContext("2d");
context.drawImage(this.image, 0, 0, sw, sh, dx, dy, dw, dh);
var imageData = canvas.toDataURL('image/png');
return imageData;
},
getBlob: function()
{
var imageData = this.getDataURL();
var b64 = imageData.replace('data:image/png;base64,','');
var binary = atob(b64);
var array = [];
for (var i = 0; i < binary.length; i++) {
array.push(binary.charCodeAt(i));
}
return new Blob([new Uint8Array(array)], {type: 'image/png'});
},

I. 紧急用!我想在网页上实现:用户上传普通头像后,网站自动将头像轮廓裁 剪成正六边形,要求裁去的部分为透

俄……有点难。也有点不清楚你的问题,抱歉了不能帮忙了嘿。。。。= =
我貌似真的不能帮忙了,很想帮你可是我还是是很会用软件类的。。。看来我要好好学了。。这个真的很难做。

J. 帝国CMS程序安装头像裁切插件,帝国CMS怎么实现头像裁切功能

图像裁切功能,帝国cms默认是不带的,需要自己用jquery来实现
自己在网上找个jquery裁切插件就OK了

热点内容
优盘的存储原理 发布:2025-01-16 21:54:27 浏览:40
编程好软件 发布:2025-01-16 20:38:07 浏览:423
流量密码如何改成 发布:2025-01-16 20:37:13 浏览:50
java判断是否是对象 发布:2025-01-16 20:31:04 浏览:885
python调用外部程序 发布:2025-01-16 20:14:09 浏览:397
缓解压力英语作文 发布:2025-01-16 20:13:31 浏览:65
javaname 发布:2025-01-16 20:13:15 浏览:22
用户访问表空间 发布:2025-01-16 20:07:07 浏览:944
java代码自动编译 发布:2025-01-16 19:58:14 浏览:314
编程很困难 发布:2025-01-16 19:58:09 浏览:674