刘鹏伟 / party · Commits

Commit b34f467c58632ed29ffc4b6470ef4e72304625df

Authored by zouyang0921
1 parent 2a2fd1c9

[年会抽奖]修复上传头像变形

Inline Side-by-side
Showing 1 changed file with 37 additions and 23 deletions
mobile.js
  View file @b34f467
... ... @@ -168,31 +168,45 @@ var action = {
168 168 loadImage: function(dom, src) {
169 169 var img = new Image();
170 170 img.src = src; // 改变图片的src
  171 + console.log('img: ', img);
171 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 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 // 上传头像
... ...