jQuery+cropper.js头像图片裁剪插件

来源:https://www.sucaihuo.com/js/4467.html 2019-06-25 11:44浏览(1060) 收藏

jQuery+cropper.js封装的头像图片裁剪插件,支持移动图像,裁剪图片,放大缩小图片,上下左右移动,图片翻转等图片编辑功能。
jQuery+cropper.js头像图片裁剪插件
分类:图片代码 > 图片插件 难易:中级
查看演示 下载资源 下载积分: 30 积分

js代码

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/cropper.js"></script>
<script type="text/javascript"> 
var img = 'img/tp.png'
$('#guyuan').click(function () {
	Model_Cropper({
		imgUrl: img, // 图片地址 / 或者 base64   注:图片地址(需要在服务器环境下  base64不需要)    
		proportion: [100, 100], // 宽/高  裁剪and压缩比例  单位px  图片等比例压缩至 200px/200px
		confirm: function (result) {   // 裁剪成功后  返回的 事件  
			// 调用 result.close() 关闭弹框   
			// result.data  为对象  base64 = 处理后base64码  blob = 图片对象 
			console.log(result)
			console.log('blob对象=======',result.data.blob)
			console.log('base64=======',result.data.base64)
			alert('打开控制台查看 裁剪压缩返回数据')
		},
	})
}) 
// 
$(function(){
	$('#guyuan').click()
})
</script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2