回答編集履歴
1
コメントを受けて追記
answer
CHANGED
|
@@ -27,4 +27,17 @@
|
|
|
27
27
|
|
|
28
28
|
このイベントは、開閉ボタンではなく、メニューに対して発生する、という点に注意してください。そのため、イベントハンドラの中から対応する開閉ボタンを見つけるために、`data-bs-target`属性を利用しています。
|
|
29
29
|
|
|
30
|
-
あと、ここでは、`show`と`shown`、および`hide`と`hidden`は、必ずペアで発生する、と想定して`toggleClass()`を使ってますが、何らかの要因でペアにならない可能性も考慮するなら、`show`と`hide`では`addClass()`し、`shown`と`hidden`では`removeClass()`する、という作戦の方が良いかもしれません。
|
|
30
|
+
あと、ここでは、`show`と`shown`、および`hide`と`hidden`は、必ずペアで発生する、と想定して`toggleClass()`を使ってますが、何らかの要因でペアにならない可能性も考慮するなら、`show`と`hide`では`addClass()`し、`shown`と`hidden`では`removeClass()`する、という作戦の方が良いかもしれません。
|
|
31
|
+
|
|
32
|
+
---
|
|
33
|
+
[追記]
|
|
34
|
+
(B)がやりたいのであれば、JSは不要だと思います。
|
|
35
|
+
メニューの開閉状態は、「ボタンに`collapsed`クラスが付いてるかどうか」で判断できるので…。
|
|
36
|
+
|
|
37
|
+
```css
|
|
38
|
+
.accordion-button1:not(.collapsed) {
|
|
39
|
+
background-color: #d7000f;
|
|
40
|
+
}
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
※`collapsed`クラスは、Bootstrapが付け外ししてくれます。
|