質問編集履歴
2
新たな方法を試したため。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -179,7 +179,26 @@
|
|
|
179
179
|
});
|
|
180
180
|
});
|
|
181
181
|
```
|
|
182
|
+
上記にあるサイトを参考にこちらもためしてみましたがactiveクラスすら追加されませんでした。検証でConsoleを見てみると、エラーは出てませんでした。もう訳が分からなくて困り果てております。
|
|
183
|
+
いろいろなサイトを見ているのですがJQueryばかりで参考にならないです。
|
|
184
|
+
```JavaScript
|
|
185
|
+
function toggleNav() {
|
|
186
|
+
var body = document.body;
|
|
187
|
+
var hamburger_menu = document.getElementById('hamburger-menu-Button');
|
|
188
|
+
var header_menu = document.getElementById("header-menu");
|
|
182
189
|
|
|
190
|
+
hamburger_menu.addEventListener('click', function() {
|
|
191
|
+
body.classList.toggle('active');
|
|
192
|
+
});
|
|
193
|
+
header_menu.addEventListener('click', function() {
|
|
194
|
+
body.classList.remove('active');
|
|
195
|
+
});
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
toggleNav();
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
|
|
183
202
|
### 補足情報（FW/ツールのバージョンなど）
|
|
184
203
|
|
|
185
204
|
ここにより詳細な情報を記載してください。
|
1
コードを見やすくしました。また回答者様から得られたコードを実行させていただきましたが結果は変わりませんでした。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -16,8 +16,7 @@
|
|
|
16
16
|
|
|
17
17
|
### 該当のソースコード
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
```HTML
|
|
20
|
-
|
|
21
20
|
<!DOCTYPE html>
|
|
22
21
|
<html lang="ja" dir="ltr">
|
|
23
22
|
|
|
@@ -52,8 +51,8 @@
|
|
|
52
51
|
<p class="header_title_sub">White flower shop</p>
|
|
53
52
|
</div>
|
|
54
53
|
</header>
|
|
55
|
-
|
|
54
|
+
```
|
|
56
|
-
|
|
55
|
+
```CSS
|
|
57
56
|
/* header */
|
|
58
57
|
.header {
|
|
59
58
|
color: white;
|
|
@@ -148,8 +147,8 @@
|
|
|
148
147
|
border-bottom: 1px solid #ccc;
|
|
149
148
|
line-height: 135px;
|
|
150
149
|
}
|
|
151
|
-
|
|
150
|
+
```
|
|
152
|
-
|
|
151
|
+
```JavaScript
|
|
153
152
|
document.addEventListener('DOMContentLoaded', function toggleNav() {
|
|
154
153
|
document.getElementById('hamburger-menu-Button').addEventListener("click",
|
|
155
154
|
function() {
|
|
@@ -166,10 +165,21 @@
|
|
|
166
165
|
});
|
|
167
166
|
|
|
168
167
|
toggleNav();
|
|
169
|
-
|
|
168
|
+
```
|
|
170
169
|
### 試したこと
|
|
170
|
+
こちらのコードを試してみたが結果は変わらなかったです。
|
|
171
|
+
```JavaScript
|
|
172
|
+
document.addEventListener('DOMContentLoaded', function() {
|
|
173
|
+
document.getElementById('hamburger-menu-Button').addEventListener("click",function() {
|
|
174
|
+
this.classList.toggle("active");
|
|
175
|
+
document.getElementById('header-menu').classList.toggle("active");
|
|
176
|
+
});
|
|
177
|
+
document.getElementById('header_menu_item').addEventListener("click", function() {
|
|
178
|
+
document.getElementById('header-menu').remove("active");
|
|
179
|
+
});
|
|
180
|
+
});
|
|
181
|
+
```
|
|
171
182
|
|
|
172
|
-
|
|
173
183
|
### 補足情報（FW/ツールのバージョンなど）
|
|
174
184
|
|
|
175
185
|
ここにより詳細な情報を記載してください。
|