在onload事件前获取图片的宽高

有时候在获取从后台的图片时,要对图片进行一系列的处理,才渲染出来
我们要解决的是没有缓存而又快速的相比onload更快的方式去获取图片的宽高,接下来上代码
通过定时循环检测获取:

// 记录当前时间戳
var start_time = new Date().getTime()
// 图片地址 后面加时间戳是为了避免缓存
 var cutSrc = window.ctx + ‘/touchsys/terminal/showCapture?terminalId=‘ + terminalId + ‘×trap=‘ +
 Math.random();
// 创建对象
var img = new Image()
// 改变图片的src
 img.src = cutSrc;
// 定时执行获取宽高
var check = function(){
 // 只要任何一方大于0
 // 表示已经服务器已经返回宽高
    if (img.width>0 || img.height>0) {
        var diff = new Date().getTime() - start_time;
        document.body.innerHTML += ‘
        from:check : width:‘+img.width+‘,height:‘+img.height+‘, time:‘+diff+‘ms‘;
        clearInterval(set);
    }
}
var set = setInterval(check,40)
// 加载完成获取宽高
img.onload = function(){
    var diff = new Date().getTime() - start_time;
    document.body.innerHTML += ‘from:onload : width:‘+img.width+‘,height:‘+img.height+‘, time:‘+diff+‘ms‘;
        //在里面在做一些我们想处理的逻辑
};

原文地址:http://blog.51cto.com/12885303/2136253

时间: 2024-10-18 05:34:34

在onload事件前获取图片的宽高的相关文章

js判断图片加载完成后获取图片实际宽高

通常,我们会用jq的.width()/.height()方法获取图片的宽度/高度或者用js的.offsetwidth/.offsetheight方法来获取图片的宽度/高度,但这些方法在我们通过样式设置了图片的宽高后获取的就不是图片的实际宽高,这显然在有些时候不是我们想要的结果,那么有没有一种方法来获取这样的实际宽高呢?答案是有的.下面的代码就能解决这样的问题: <img src="01.jpg" id="test" width="250px"

在渲染前获取 View 的宽高

在渲染前获取 View 的宽高 这是一个比较有意义的问题,或者说有难度的问题,问题的背景为:有时候我们需要在view渲染前去获取其宽高,典型的情形是,我们想在onCreate.onStart.onResume中去获取view的宽高.如果大家尝试过,会发现,这个时候view还没有measure好,宽高都为0,那到底该怎么做才能正确获取其宽高呢,下面给出三种方法(还有其他方法, 比如监听器回调等): Activity/View#onWindowFocusChanged :这个方法表明,view已经初

根据图片的链接获取图片的宽高

//根据图片的链接获取图片的宽高 - (CGSize)downloadImageSizeWithURL:(id)imageURL { NSURL *URL = nil; if([imageURL isKindOfClass:[NSURL class]]){ URL = imageURL; } if([imageURL isKindOfClass:[NSString class]]){ URL = [NSURL URLWithString:imageURL]; } if(URL == nil) r

根据图片url地址获取图片的宽高

1 /** 2 * 根据img获取图片的宽高 3 * @param img 图片地址 4 * @return 图片的对象,对象中图片的真实宽高 5 */ 6 public BufferedImage getBufferedImage(String imgurl) { 7 URL url = null; 8 InputStream is = null; 9 BufferedImage img = null; 10 try { 11 url = new URL(imgurl); 12 HttpURL

Js获取图片原始宽高

如果我们页面看到的图片都是缩略图,那就需要做个图片点击放大效果,那么怎样获取图片的原始宽高呢?方法如下: //获取图片原始宽度 function getNaturalWidthAndHeight(img) { var image = new Image(); image.src = img.src; return [image.width,image.height]; } //点击缩略图弹出层,显示原始图片. //获取class为tz_main_box下的所有p标签下的图片img $(".tz_

UIImageView 获取图片的 宽 高

该文章纯属这两天开发的经验之谈 并且也是平常没注意 这回发现的一个小方法 并且很实用 在开发中 提高了很大的效率 更加符合高保真的要求 通常 美术 切的一些图片 需要 1:1还原的 现在 我们一般支持ios 版本 是 >= ios7.0 需要的切图 是@2X @3X 的 我之前一般是 根据@2X 的图 比例 除以2 得到的尺寸 设置 imageView .frame 比如 : //@2X 图片大小如果是 80 * 80 UIImageView * imageView = [[UIImageVie

Python 获取图片像素宽高信息

# coding: utf8 from PIL import Image img = Image.open("img.jpg") print img.size

.Net 上传图片之前获取图片的宽高

Stream st = Request.Files[0].InputStream;                  Byte[] buffer = new Byte[st.Length];                st.Read(buffer, 0, buffer.Length);                MemoryStream stream = new MemoryStream(buffer);                   Bitmap img = new Bitmap

图片上传时获取图片的宽和高

经常会遇到图片上传的问题,这时候我们会传图片的地址,宽和高到服务器,至于图片上传就不说了,这里主要说图片上传时获取图片的原始宽和高的问题. 一般而言,我们把图片上传至服务器时,服务器会返回一个上传地址给我们,这个就是我们图片的url了,但是光有这个还是不够的,因为还要将图片的宽和高传给服务器,这时候就可以这样做了.直接上代码: var img = new Image() img.src = url 然后就可以使用img.width和img.height来获取图片的宽和高了.当然仅仅这样做是不够的