TA的每日心情 | 衰 2021-2-2 11:21 |
---|
签到天数: 36 天 [LV.5]常住居民I
|
java实现的上传头像裁剪功能源码 实现一
0 |+ l- x. M; B! U. e+ Y" M e环境:struts2
/ C, p( I- `3 |+ ~2 Vjs组件:query-1.7.2.js,jquery.Jcrop.min.js,styles/jquery.Jcrop.min.css
5 `0 E2 I% u, h5 n8 Y7 `3 @* p1 t
' L3 G3 j) H% i' `! D1 J
0 C: r y& ?( I2 w 此插件可以进行裁剪 但是暂时没有好的办法对其进行缩放裁剪 只有在原图不变的情况下 获取 坐标才可以精确的 进行裁剪。基本功能可以实现。
1 `0 A/ q! r8 L, T
$ `( M' {+ n6 l! M" c, A实现效果图:
7 M s& |2 u% P5 H. f
5 X7 Q% B8 { B. ?7 I- o2 _. r7 c" ?( t# O
8 y! ]$ B7 q. N9 D% K! Q
" A3 l9 m! R( k" u5 z
0 @& f9 I9 Y5 A
: t7 ?" ]( d1 t- O6 ~0 i
演示地址:http://avatar.52itstyle.com/index.html* _! {1 ]& l( u- E
9 v& _; p9 f/ s) ~$ t
- s! N1 r4 H, S; D5 h4 M0 Pjava实现的上传头像裁剪功能源码 实现二- J5 w9 c- C7 \" R: A
0 F' H J9 A* s' T9 G$ J
环境搭:struts2 +smartupload
- J6 b% D, O) r$ @% o/ p/ cjs组件:query-1.7.2.js 、 camera.swf、common.js5 e0 I1 A2 A6 Y$ b A
) S$ m5 E6 x( ?' h" ~0 L: S, A
3 I- P) w* h& o) m0 s功能介绍:
: i8 K) l6 n6 N
$ Z9 Y9 M! w: l& t1.上传并预览,用户可以任意选择区域、正方形或者长方形。+ P- V* \9 @, ?1 J W- V+ ]
2.支持上传成功,js 回调函数 对返回头像进行展示操作。0 q; e% N8 o# v0 f# S( n2 C
3.无论图片过大还是过小,都可以按照固定大小显示。
6 w1 u/ }) t# S: o' E4.支持头像拍照保存。
8 k( b: [7 D! w6 x5 N* M8 e2 [! ?5.图片上传支持进度显示。
1 B$ Q6 Y: t7 t- ?9 s6.上传成功后可以保存为三种不同格式的图片。# Q: ?7 A$ N% U( Y/ u5 C0 P
" n& s: M5 ]* {' \4 X6 B, j' d实现效果图展示:, ]$ Y7 \# d0 ^
0 i9 ~' k3 E, h+ V4 |
" Q8 X5 m( \. |$ \/ p, m+ v
* m5 M( ~2 s; D& N
& ~% [. j( Q; s# `) D
# B6 l. p. ]* n. L6 q# g
8 k5 @. z+ c9 j: H2 U2 |( H6 p* B
演示地址:http://avatar.52itstyle.com/upload/avatar.jsp9 H$ n6 o. E6 M$ S
源码地址:http://www.52itstyle.top/thread-5204-1-1.html
, k' v7 H; l4 g( ?" j |
|