jquery - 動的背景画像jquery

Question

すべての<h2>背景位置を jQuery で動的に変更した後、<h2>サイズを 100% に変更します。私のコードは次のとおりです。

CSS:

h2 { display: inline-block;}

jquery:

$("h2").css("background-position", "0px 0px").animate({
    'background-position-x': $(this).width(),
    'background-position-y': "3px",
    'width': "100%"
});

しかし、$(this)これは関数ではないため、機能しません。

Answer 1

$("h2").css("background-position","0px 0px").each( function() {
  var h2 = $(this);
  h2.animate({
    'background-position-x': h2.width(),
    'background-position-y': "3px",
    'width': "100%"
  });
});

Answer 2

明示的なループを使用する必要があります。

$("h2").each(function () {
    $(this).css("background-position", "0px 0px");
    $(this).animate({
        'background-position-x': $(this).width() + "px",
        'background-position-y': "3px",
        'width': "100%"
    });
});