0

CSS のカスタム プロパティの 1 つをオンデマンドで置き換える必要があります。体に複数の背景を指定し、ユーザーが特定のボタンをクリックすると、それらの背景の一部を変更したいと思います。たとえば、最初のスタイルシートは次のようになります。

:root {
  --value1: url("img/value1.png");
  --value2: url("img/value2.png");
  --value3: url("img/value3.jpg");
}

.background {
  background-image: var(--value1), var(--value2), var(-value3) ;
}

しかし、ユーザーがインターフェイスの「value4」ボタンをクリックすると、「--value2」を「img/value4.png」に置き換えたいと思います。

function setCustomValue() {
  $(":root").css('--value2', 'img/value4.png');
}

このコードはルート HTML にスタイルを追加するだけですが、既存のカスタム プロパティの値を置き換えたいのですが、ここで得たい結果は次のとおりです。

:root {
   --value1: url("img/value1.png");
   --value2: url("img/value4.png");
   --value3: url("img/value3.jpg");
}
    
.background {
  background-image: var(--value1), var(--value2), var(-value3) ;
}

誰かがこれで私を助けることができますか?

4

0 に答える 0