1

jQueryに、クラス「画像」を使用してdiv内の画像の高さ/幅の属性を見つけさせ、それらの値をCSSとして「画像」の子であるクラス「オーバーレイ」を使用してdivに適用しようとしています。以下のコードは、私がこれまでに得たものです。「画像」の1つのインスタンスに最適です。しかし、「画像」のすべてのインスタンスを通過させ、正しい値を「オーバーレイ」に適用する方法がわかりません。.each をいじってみましたが、うまくいきませんでした。

HTML:

<div class="image">
    <img src="some-img" width="400" height="200" />
    <div class="overlay"></div>
</div>

jQuery:

var height = $("img").attr("height");
var width = $("img").attr("width");

    $(".overlay").css({
        height: height,
        width: width
    });

前もって感謝します！

4

2 に答える 2

3 
$(".image").each(function(index, el) {
    var $img = $("img", this); // equivalent: $(this).find("img")
    $(".overlay", this).css({
         height: $img.attr("height"),
         width: $img.attr("width")
    });
});

img要素自体を反復処理し.next()、それぞれのオーバーレイを取得するために使用することもできます。

于 2012-09-09T18:08:11.947 に答える
2

私はお勧めします：

$('.image img').each(
    function(){
        var that = $(this),
            h = that.height(),
            w = that.width();
        that.next().css({ 'height' : h, 'width' : w });
    });
于 2012-09-09T18:08:31.207 に答える