Javascript高度问题

我正在使用javascript为页面上的所有图像文章添加垂直或水平类。我遇到代码正在工作的问题，但它总是向文章类添加.horizontal，甚至包含应该有.vertical（包含图片大于450px的帖子）的照片。任何帮助，将不胜感激。Javascript高度问题

$('img.photo').each(function(){ 
      if($(this).height() > 450) { 
       $(this).closest('article').addClass('vertical'); 
      } else { 
       $(this).closest('article').addClass('horizontal'); 
      } 
     });

举例：http://blog.jamescharless.com/ 孩子的第一张照片是远远超过450像素高的，但它不具有类的垂直，而是有水平的。

来源

2012-09-11 James Charless Dickinson

适合我..刚刚测试。 [JSFiddle]（http://jsfiddle.net/93dTG/） –

你能发布一些html吗？ –

添加一些日志记录：'console.log（this，$（this）.height（））' – Joe

尝试改变.each到.load，使函数被调用为每个图像一旦加载：

$('img.photo').load(function(){ 
      if($(this).height() > 450) { 
       $(this).closest('article').addClass('vertical'); 
      } else { 
       $(this).closest('article').addClass('horizontal'); 
      } 
     });

来源

2012-09-11 20:07:21 ori

两个可能的原因的高度并不如预期

图像尚未加载并没有在CSS中定义的高度
图像尚未显示（display: none）

您的代码可能会利用load回调，并且还应该检查图像不是:hidden。

$(function(){ 
    $('img:not(:hidden)').load(function(){ 
     // logic 
    }); 
});

来源

2012-09-11 20:07:37

Javascript高度问题

回答

相关问题