質問編集履歴
1
誤字の修正及び内容の追記
test
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
ヘッダーを固定したら wrapperが効か
|
|
1
|
+
ヘッダーを固定したら wrapperが効かなくなってしまいました。なぜでしょうか？
|
test
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
position : fixed;でヘッダーを固定したところ
|
|
2
2
|
class="wrapper"で左右に余白を作っていましたが、左端に寄ってしまいました。
|
|
3
|
-
|
|
3
|
+
誤字がないか確認したり、コードを入力し直したりしました。半日試行錯誤しましたが、どうしてもwrapperが効きません、、なぜだか分かる方いらっしゃいますか？
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
```html
|
|
@@ -127,7 +127,7 @@
|
|
|
127
127
|
}
|
|
128
128
|
|
|
129
129
|
|
|
130
|
-
/*
|
|
130
|
+
/*ハンバーガーメニュー*/
|
|
131
131
|
header{
|
|
132
132
|
display: flex;
|
|
133
133
|
justify-content: space-between;
|
|
@@ -179,3 +179,27 @@
|
|
|
179
179
|
}
|
|
180
180
|
|
|
181
181
|
```
|
|
182
|
+
```javascript
|
|
183
|
+
'use strict';
|
|
184
|
+
|
|
185
|
+
{
|
|
186
|
+
const open = document.getElementById('open');
|
|
187
|
+
const overlay = document.querySelector('.overlay');
|
|
188
|
+
const close = document.getElementById('close');
|
|
189
|
+
|
|
190
|
+
|
|
191
|
+
open.addEventListener('click', () => {
|
|
192
|
+
overlay.classList.add('show');
|
|
193
|
+
open.classList.add('hide');
|
|
194
|
+
|
|
195
|
+
|
|
196
|
+
});
|
|
197
|
+
|
|
198
|
+
close.addEventListener('click', () => {
|
|
199
|
+
overlay.classList.remove('show');
|
|
200
|
+
open.classList.remove('hide');
|
|
201
|
+
|
|
202
|
+
|
|
203
|
+
});
|
|
204
|
+
}
|
|
205
|
+
```
|