如何设置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 */
}