今天遇到了一个奇怪的bug
需要将图片裁剪至合适的大小,然后我这样一个方法12345var x = 65;if(width>height) $(this).css("height",x);else $(this).css("width",x);
由于各种原因<img>
元素是通过字符串在js里面拼接出来的,上面那个方法用在append到界面上之后
刚做完的时候貌似没有问题,但是多刷新几次之后,神奇的事情发生了,这个方法居然时灵时不灵!
后来通过研究发现,这个方法应该在图片加载完之后调用。
下面是改良之后的方法:
|
|
定义了图片的onload事件,在图片加载完之后执行。
这里需要注意一个细节
不要把oIMG.src=obj.src;
这一句紧跟在var oIMG = new Image();
之后。
除了这个方法之外,还可以使用图片的complete 属性,如用以下方法获取图片的尺寸123456789101112var imgLoad = function (url) { var img = new Image(); img.src = url; if (img.complete) { callback(img.width, img.height); } else { img.onload = function () { callback(img.width, img.height); img.onload = null; }; };};