質問編集履歴

2

修正

2021/12/21 11:02

投稿

KKsall
KKsall

スコア25

test CHANGED
File without changes
test CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- https://codepen.io/pen/
5
+ https://codepen.io/boo-jp/pen/LYzjLdY
6
6
 
7
7
 
8
8
 

1

修正

2021/12/21 11:02

投稿

KKsall
KKsall

スコア25

test CHANGED
File without changes
test CHANGED
@@ -1,5 +1,83 @@
1
- コピペしたのですが、なぜかエラーで動きません。レクチャーいただければ幸いです
1
+ なぜかエラーで動きません。レクチャーいただければ幸いです
2
2
 
3
3
 
4
4
 
5
5
  https://codepen.io/pen/
6
+
7
+
8
+
9
+
10
+
11
+ ```ここに言語を入力
12
+
13
+ <div class="menu">
14
+
15
+ <div class="line-list" id="js-hamburger">
16
+
17
+ <span></span>
18
+
19
+ <span></span>
20
+
21
+ <span></span>
22
+
23
+ </div>
24
+
25
+ <div class="menu-bg" id="js-menu-bg"></div>
26
+
27
+ <nav class="global-nav">
28
+
29
+ <ul class="link-list">
30
+
31
+ <li><a href="#">メニュー1</a></li>
32
+
33
+ <li><a href="#">メニュー2</a></li>
34
+
35
+ <li><a href="#">メニュー3</a></li>
36
+
37
+ </ul>
38
+
39
+ </nav>
40
+
41
+ </div>
42
+
43
+ ```
44
+
45
+ ```ここに言語を入力
46
+
47
+ $(function() {
48
+
49
+ function toggleNav() {
50
+
51
+ var body = document.body;
52
+
53
+ var hamburger = document.getElementById("js-hamburger");
54
+
55
+ var blackBg = document.getElementById("js-menu-bg");
56
+
57
+ // クリックしたときにクラス付与
58
+
59
+ hamburger.addEventListener("click", function() {
60
+
61
+ body.classList.toggle("nav-open");
62
+
63
+ hamburger.classList.toggle("active");
64
+
65
+ });
66
+
67
+ // クリックしたときにクラス付与
68
+
69
+ blackBg.addEventListener("click", function() {
70
+
71
+ body.classList.remove("nav-open");
72
+
73
+ hamburger.classList.remove("active");
74
+
75
+ });
76
+
77
+ }
78
+
79
+ toggleNav();
80
+
81
+ });
82
+
83
+ ```