javascript - すべての画像の幅を確認し、特定のサイズを超える場合は新しい幅を設定します

Question

同じクラス ".bestsell-thumb" を持つ複数の画像を含むページがあります。これらすべての画像を配列にしてから、それぞれの幅を取得し、80px より大きい場合は 80px に変更するにはどうすればよいですか?

私はこれを試しました

var  bsThumb = $(".bestsell-thumb").each(function(){
             $(this).height();
});

高さを取得するだけですが、私はかなり離れていると確信しています。

助けてくれてありがとう。

score 4 · Accepted Answer

$(".bestsell-thumb").width(function(i, w) {
    return w > 80 ? 80 : w;
});

もちろん、何かを取得する前にロードする必要があります!

score 0 · Accepted Answer

試す

$(".bestsell-thumb").each(function(){
    if ($(this).width() > 80) {
        $(this).css("width", "80px");
    }
});

score 0 · Accepted Answer

あなたが試すことができます：

$(".bestsell-thumb").each(function(){
    if($(this).width() > 80){
        $(this).width("80px");
    }
});

score 0 · Accepted Answer

JavaScript の代わりに CSS を使用します。

.bestsell-thumb {
  max-width: 80px;
  height: auto; /* maintains proportions */
}

max-height同じスタイルブロックで設定することもできます。同様に設定width: autoするだけです。

4 に答える 4