回答編集履歴

CSSの変更だけでいけました。

2021/02/16 14:31

投稿

スコア127

answer CHANGED Viewed

@@ -1,29 +1,11 @@
-やり方はいくらでもあるのでしょうけど、
+visibility を追加するだけでいけました。
-max-width:600pxまでのときに、display:none に設定して、????を押したときに、jQuery側で表示非常時に設定すればいけるかと思います。
 ```CSS
-@media (max-width:600px){
+nav.globalMenuSp {
-    header ul{
-        /*display: flex;*/
-        justify-content: center;
-        flex-direction:column;
-        z-index:70;
-        display:none;
+  visibility: hidden;
-    }
 }
-```
-```jQuery
-$(function() {
-    $('.hamburger').click(function() {
-        $(this).toggleClass('active');
-        if ($(this).hasClass('active')) {
-            $('.globalMenuSp').addClass('active');
+nav.globalMenuSp.active {
-            $('header ul').css('display','flex');
-        } else {
+  opacity: 100;
-            $('.globalMenuSp').removeClass('active');
+  visibility: visible;
-            $('header ul').css('display','none');
-        }
+}
-    });
-});
 ```