Commit b34f467c58632ed29ffc4b6470ef4e72304625df
1 parent
2a2fd1c9
[年会抽奖]修复上传头像变形
Showing
1 changed file
with
37 additions
and
23 deletions
mobile.js
| @@ -168,31 +168,45 @@ var action = { | @@ -168,31 +168,45 @@ var action = { | ||
| 168 | loadImage: function(dom, src) { | 168 | loadImage: function(dom, src) { |
| 169 | var img = new Image(); | 169 | var img = new Image(); |
| 170 | img.src = src; // 改变图片的src | 170 | img.src = src; // 改变图片的src |
| 171 | + console.log('img: ', img); | ||
| 171 | if (img.complete) { // 判断是否有缓存 | 172 | if (img.complete) { // 判断是否有缓存 |
| 172 | - action.adjustImageSize(dom, img); | 173 | + var width = parseInt($(dom).css('width')); |
| 174 | + console.log('dom-width: ', width); | ||
| 175 | + console.log('img-width: ' + img.width, 'img-height: ' + img.height); | ||
| 176 | + var ratio = img.width / img.height; | ||
| 177 | + if (ratio > 1) { | ||
| 178 | + img.height = width; | ||
| 179 | + img.width = width * ratio; | ||
| 180 | + var margin = (img.width - img.height) / 2; | ||
| 181 | + $(dom).css("margin-left", -margin + 'px'); | ||
| 182 | + } else if (ratio < 1) { | ||
| 183 | + img.width = width; | ||
| 184 | + img.height = width / ratio; | ||
| 185 | + var margin = (img.width - img.height) / 2; | ||
| 186 | + $(dom).css("margin-top", margin + 'px'); | ||
| 187 | + } else { | ||
| 188 | + img.width = width; | ||
| 189 | + img.height = width; | ||
| 190 | + } | ||
| 173 | } else { // 加载完成执行 | 191 | } else { // 加载完成执行 |
| 174 | - action.adjustImageSize(dom, img); | ||
| 175 | - } | ||
| 176 | - }, | ||
| 177 | - // 调整头像尺寸 | ||
| 178 | - adjustImageSize: function(dom, img) { | ||
| 179 | - var width = parseInt($(dom).css('width')); | ||
| 180 | - console.log('dom-width: ', width); | ||
| 181 | - console.log('img-width: ' + img.width, 'img-height: ' + img.height); | ||
| 182 | - var ratio = img.width / img.height; | ||
| 183 | - if (ratio > 1) { | ||
| 184 | - img.height = width; | ||
| 185 | - img.width = width * ratio; | ||
| 186 | - var margin = (img.width - img.height) / 2; | ||
| 187 | - $(dom).css("margin-left", -margin + 'px'); | ||
| 188 | - } else if (ratio < 1) { | ||
| 189 | - img.width = width; | ||
| 190 | - img.height = width / ratio; | ||
| 191 | - var margin = (img.width - img.height) / 2; | ||
| 192 | - $(dom).css("margin-top", margin + 'px'); | ||
| 193 | - } else { | ||
| 194 | - img.width = width; | ||
| 195 | - img.height = height; | 192 | + var width = parseInt($(dom).css('width')); |
| 193 | + console.log('dom-width: ', width); | ||
| 194 | + console.log('img-width: ' + img.width, 'img-height: ' + img.height); | ||
| 195 | + var ratio = img.width / img.height; | ||
| 196 | + if (ratio > 1) { | ||
| 197 | + img.height = width; | ||
| 198 | + img.width = width * ratio; | ||
| 199 | + var margin = (img.width - img.height) / 2; | ||
| 200 | + $(dom).css("margin-left", -margin + 'px'); | ||
| 201 | + } else if (ratio < 1) { | ||
| 202 | + img.width = width; | ||
| 203 | + img.height = width / ratio; | ||
| 204 | + var margin = (img.width - img.height) / 2; | ||
| 205 | + $(dom).css("margin-top", margin + 'px'); | ||
| 206 | + } else { | ||
| 207 | + img.width = width; | ||
| 208 | + img.height = width; | ||
| 209 | + } | ||
| 196 | } | 210 | } |
| 197 | }, | 211 | }, |
| 198 | // 上传头像 | 212 | // 上传头像 |