-1

如果照片的高度超过 450 像素高，有没有办法让页面上的每个图像都具有“.photo”类并将“.vertical”类应用于它所在的文章？我这样做的原因是因为我希望高大的照片不那么宽，因此添加 .vertical 类来设置它所在的文章的样式，使文章的宽度为 250 像素，而不是正常的 500 像素宽度......

基本上，如果在页面上显示照片的 500px 版本并且 500px 照片的高度超过 450px，它应该通过向该文章添加类 .vertical 来调整其所在的整篇文章的大小。

这听起来令人困惑，但不是一旦你理解它。我是新手，所以代码很受欢迎，我不知道该怎么做。

4

5 回答 5

4

就在这里。

首先获取图像高度。如何使用 javascript 获取图像大小（高度和宽度）？

.addClass()如果高度符合您的要求，然后使用添加一个类。

于 2012-09-11T01:06:17.540 回答
0

尝试：

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

更新为向父文章添加类。article根据需要更改选择器。

于 2012-09-11T01:08:21.957 回答
0

尝试这个：

$(".photo").each(function(){
  var el = $(this);
  if (el.height() > 450)
    el.addClass("vertical");
});
于 2012-09-11T01:08:29.897 回答
0

就像是：

$(".photo").each(function(i) { 
  if ($(i).height() >450) {
     $(i).addClass('yourclass');
  }
});
于 2012-09-11T01:09:05.210 回答
0

希望这会让你开始：

$('img.photo').each(function(index) {
    var height = $(this).height();
    if (height > 450) {
        $(this).parent().addClass('vertical');
    }
});

编辑：

关于将 .vertical 类添加到包含图像的文章中，这取决于您的标记。@anonymous 有一个可能的想法，即找到最接近 .article 类的元素。如果直接父级是包含图像的文章，您也可以在我上面编辑的代码中使用父级。

于 2012-09-11T01:09:49.297 回答