質問編集履歴
4
ソースの追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -14,6 +14,15 @@
|
|
|
14
14
|
|
|
15
15
|
```html
|
|
16
16
|
<nav class="globalNav">
|
|
17
|
+
|
|
18
|
+
<div class="drawer"><!-- スマホ用メニュー -->
|
|
19
|
+
<div class="navbar_toggle">
|
|
20
|
+
<span class="navbar_toggle_icon"></span>
|
|
21
|
+
<span class="navbar_toggle_icon"></span>
|
|
22
|
+
<span class="navbar_toggle_icon"></span>
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
|
|
17
26
|
<div class="menu">
|
|
18
27
|
<ul class="nav">
|
|
19
28
|
<li><a href="#link01">メニュー01</a></li>
|
3
ソースの修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -98,10 +98,9 @@
|
|
|
98
98
|
});
|
|
99
99
|
|
|
100
100
|
$('.menu a').on('click', function() {
|
|
101
|
-
$(
|
|
101
|
+
$('.menu').toggleClass('open');
|
|
102
|
-
$(
|
|
102
|
+
$('.navbar_toggle').toggleClass('open');
|
|
103
103
|
});
|
|
104
|
-
|
|
105
104
|
});
|
|
106
105
|
```
|
|
107
106
|
|
2
ソースの追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -88,7 +88,25 @@
|
|
|
88
88
|
jsの記述で解消されるかと思いますが、js自体詳しくないので質問しました。
|
|
89
89
|
chromeのDevtoolsでみるところ、display:block;は効いてるみたいです。
|
|
90
90
|
|
|
91
|
+
色々確認してると、レスポンシブでグローバルメニューを格納してるjavascriptと競合してる可能性が強まりました。
|
|
91
92
|
|
|
93
|
+
```jquery
|
|
94
|
+
$(function() {
|
|
95
|
+
$('.navbar_toggle').on('click', function () {
|
|
96
|
+
$(this).toggleClass('open');
|
|
97
|
+
$('.menu').toggleClass('open');
|
|
98
|
+
});
|
|
99
|
+
|
|
100
|
+
$('.menu a').on('click', function() {
|
|
101
|
+
$(".menu").toggleClass('open');
|
|
102
|
+
$(".navbar_toggle").toggleClass('open');
|
|
103
|
+
});
|
|
104
|
+
|
|
105
|
+
});
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
|
|
109
|
+
|
|
92
110
|
### 補足情報（FW/ツールのバージョンなど）
|
|
93
111
|
|
|
94
112
|
html5
|
1
ソースの修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -16,17 +16,17 @@
|
|
|
16
16
|
<nav class="globalNav">
|
|
17
17
|
<div class="menu">
|
|
18
18
|
<ul class="nav">
|
|
19
|
-
<li><a href="#
|
|
19
|
+
<li><a href="#link01">メニュー01</a></li>
|
|
20
|
-
<li><a href="#
|
|
20
|
+
<li><a href="#link02">メニュー02</a></li>
|
|
21
|
-
<li><a href="#
|
|
21
|
+
<li><a href="#link03">メニュー03</a></li>
|
|
22
|
-
<li><a href="#
|
|
22
|
+
<li><a href="#link04">メニュー04</a>
|
|
23
23
|
<ul class="dropMenu">
|
|
24
24
|
<li><a href="#mealsLink01">ドロップメニュー01</a></li>
|
|
25
25
|
<li><a href="#mealsLink02">ドロップメニュー02</a></li>
|
|
26
26
|
<li><a href="#mealsLink03">ドロップメニュー03</a></li>
|
|
27
27
|
</ul>
|
|
28
28
|
</li>
|
|
29
|
-
<li><a href="#
|
|
29
|
+
<li><a href="#link05">メニュー05</a></li>
|
|
30
30
|
</ul>
|
|
31
31
|
</div>
|
|
32
32
|
</nav>
|