javascript - クリック時に CSS を変更し、次のクリックで再び元に戻す

Question

私は答えを探しましたが、何もうまくいきません。divをクリックして背景を変更できるようにしたいので、次にdivをクリックすると元に戻ります。最初の部分は機能しますが、2番目の部分を行う方法がわかりません。

これが機能するものです（jQueryを使用）：

$(document).ready(function(){
$('.button').click(function() {
$('.icon').css("background-position", "0px 0px");
});
});

どんな助けでも感謝します、ありがとう。

Answer 1

.css メソッドを使用するのではなく、.toggleClass を使用して、関連する css をクラスに入れることをお勧めします。

$('.icon').toggleClass('myClass');

あなたのクラス定義:

.myClass { background-position: 0px 0px };

.toggleClass メソッドは、クラスがまだ存在しない場合は追加し、存在する場合は削除します。

Answer 2

css クラスを使用してトグルする必要があります。

.zero{
    background-position: "0px 0px";
}

$(document).ready(function(){

    $('.button').click(function() {

            $('.icon').toggleClass("zero")

    });
});