var img = $("#img_id"); // Get my img elem
var pic_real_width, pic_real_height;
$("<img/>") // Make in memory copy of image to avoid css issues
    .attr("src", $(img).attr("src"))
    .load(function() {
        pic_real_width = this.width;   // Note: $(this).width() will not
        pic_real_height = this.height; // work for in memory images.
    });

　　从技术上，我们可以轻松的用文本的最大宽度限制图片，让它们都保持一个宽度，而不按文本的宽度时，我们就需要每个图片的自己的尺寸。我们可以在服务端编辑时声明图片的原始尺寸。而一种更灵活的方式是通过在页面上放一段js来动态的获取图片的原始大小尺寸，动态改变图片的显示大小。这样即能兼容老的也文本最大宽度的方式，还可以在需要的时候让图片呈现出其原始的大小。

Webkit浏览器(谷歌浏览器等)是在图片的loaded事件之后才能获取高度和宽度值。所以，你不能使用timeout函数延时等待，最好的方法是使用图片的onload事件。

为了避免CSS对图片大小尺寸的影响，上面的代码将图片拷贝到内存中进行计算。

如果你的页面是老式页面，你可以按需把这段代码嵌入页面底部，它不需要你修改原有页面。

优质内容筛选与推荐>>
1、保守的任正非大胆预言：人工智能、VR正让人类巨变，会崛起许多大产业
2、Jumpserver配置与运行
3、日志那些事儿——谈谈需要日志输出的clientjar应该如何设计
4、BZOJ2127:happiness(最小割解决集合划分)
5、Puppeteer初探之前端自动化测试