php - jQuery 按类调整文档上所有图像的大小

Question

我有一个包含图像的页面，我希望使用 jQuery 在文档上调整它们的大小(通过获取某些 CSS 类)。这些图像有一个初始的“.test”，它在 CSS 文件中没有属性。我知道如何为他们提供新类(class)，以便调整它们的大小。但是，我想根据宽度或高度调整大小，以便它们看起来都一样。

我的问题是我无法让它们的宽度/高度继续。我的代码是这样的:

$(document).ready(function(){

    $('.test').each(function(){
        var img_width = $(this).width();
        var img_height = $(this).height();
        alert("My width:" + img_width + "px, My Height: " + img_height + "px");

        if (img_width > img_height)
        {
            //resize to height
        }else{
            //resize to width
        }
    });
})

if 语句之前的警报始终返回 0 - 尽管它确实出现了正确的次数。

我还尝试使用 $(this).width; 和 $(this).offsetHeight; 和 $ 获取宽度(以及高度) (this).attr('width'); 但当结果不为 0 时，它是未定义。

我做错了什么？

Answer 1

使用

$(window).load(function() {

而不是

$(document).ready(function(){

当所有图像实际加载完毕后，加载事件会稍后触发。

use jQuery's .load() method to attach load event handlers to the window or to more specific items, like images.

来源:http://api.jquery.com/ready/