jquery - 如何设置用ajax加载的图像的宽度？

Question

我有一个图片网站，并实现了图片的无限滚动。问题是我不知道如何在加载后使用 jQuery 调整图像大小。

我正在使用 jQuery 1.5 版的 drupal。

这是我到目前为止不起作用的代码：

jQuery(body).delegate("#region-content","onchange",function() {
jQuery('#region-content img').each(function() {
    var desiredWidth = 520; // Max width for the image
    var ratio = 0;  // Used for aspect ratio
    var width = jQuery(this).width();    // Current image width
    var height = jQuery(this).height();  // Current image height



    if(width != desiredWidth){
        ratio = desiredWidth / width;   // get ratio for scaling image
        jQuery(this).css("width", desiredWidth); // Set new width
        jQuery(this).css("height", height * ratio);  // Scale height based on ratio
        height = height * ratio;    // Reset height to match scaled image
        width = width * ratio;    // Reset width to match scaled image
    }

});
});

Answer 1

要保持纵横比，只需设置宽度。你可以在css中做：

css

#region-content{
  height: 520px;
  overflow: auto;
}

#region-content img{
  max-width: 520px; /* only width */
}