Question

我很好奇是否可以查看图像宽度，如果宽度小于X数，那么它会获得某个类。

基本上我想为图像指定三个类：

如果宽度小于100px，则图像本身将具有类.small
如果宽度小于400px，那么图像本身将获得类.medium
如果宽度小于600像素，则图像本身将获得类.large

..等如果我需要添加更多尺寸和类

这可能吗？

Answer 1

var img = $("#myImage");
var width = img.width();
if (width < 100)
    img.addClass("small");
else if (width < 400)
    img.addClass("medium");
else if (width < 600)
    img.addClass("large");

未经测试，但看起来不错。

此外，如果您想将这些规则应用于文档中的所有图像，或者至少应用于特定容器中的所有图像，您可以：

$("#divWithImages img").each(function(i, el)
{
    var img = $(el);
    var width = img.width();
    if (width < 100)
        img.addClass("small");
    else if (width < 400)
        img.addClass("medium");
    else if (width < 600)
        img.addClass("large");
});

根据图像宽度指定类

1 个答案: