jquery - 画像 CSS をアニメーション Jquery で onClick に変更

Question

CSS を使用して画像の高さと幅を 100px に設定しましたが、画像をクリックすると高さと幅が 400px に変更されるようにしたいのですが、変更をアニメーション化することも必要です。

私はこれで私の試みを始めました：

$('img').click(function() {
  $('img').animate({
    height: '400px',
    width: '400px',
  }, 5000, function() {
  });
});

編集:タイプについて申し訳ありません。目的は、選択されている画像のみをアニメーション化することです。

また、これを機能させようとしているサイトへのリンクは次のとおりです。OUR WORK をクリックし、サムネイルをクリックします。クリック時に画像のサイズを変更したい。ここをクリックしてください。

score 3 · Accepted Answer

ハンドラー関数内で使用thisして現在の画像を指定します。また、アニメーション化するプロパティに文字列の代わりに数字を使用することもできます。また、幅と高さの代わりに高さを 2 倍にします。

$('img').click(function() {
  $(this).animate({
    height: 400,
    width: 400,
  }, 5000, function() {
  });
});

score 0 · Accepted Answer

$('img').click(function() {
  $(this).animate({
    height: '400px',
    width: '400px',
  }, 1000, function() {
  });
});

this1）内部セレクターの代わりに使用したい'img'場合。そうしないと、1 つの画像をクリックすると、すべての画像がアニメーション化されます。

2) height2 回含めました。

2 に答える 2