jquery获取图像大小
我正在使用jquery创建一个照片库。 我正在拍摄并调整负载大小以创建缩略图。 我想获得图像大小的原始值,以便稍后我可以将其恢复到原始大小。 有人知道怎么做吗? 我有以下代码:
obj.find("img").each(function(){ });
这循环遍历容器div中的所有图像。 然后我尝试做:
$(this).width(); //didnt work this.width; //didnt work
有任何想法吗?
我最近问了同样的问题并得到了一个很好的答案:创建了一个新的图像元素,但没有附加到DOM。 它的高度和宽度是图像的原始尺寸。
编辑 :我现在按照评论中的承诺编辑了我的问题的答案。 现在,图像大小的检测与图像的onload
事件绑定,以保证可靠的结果。
如果一个元素被隐藏你无法获得它的大小,如果你想在显示它之前得到它的宽度或高度,你需要给出一个负偏移量
#your_image {left:-1000%;}
只有这样
$(this).width()
会告诉你结果。
使用jQuery获取图像大小的问题通常是我们使用$()。ready(function()); 执行我们的javascript,但在页面加载时,图像尚未加载,所以你需要等待它首先发生。 一旦确定图像已加载并且图像可见,您可以正常使用$ .width()和$ .height()。
如果您使用脚本语言生成图像大小,那么您可以尝试的一件事是在读取文件后获取宽度和高度属性并获得相应的大小。 由于你正在创建一个库,你可能会考虑使用imagemagick of gd for php来调整后端图像的大小。 这些工具有大量的在线文档,所以我不会在这里介绍它。
$("#your_img").imagesLoaded(function(){
alert( $(this).width() );
alert( $(this).height() );
});