質問編集履歴

2

なんどもすみません。コード訂正しました。

2020/12/16 01:43

投稿

Fukusuke0604
Fukusuke0604

スコア554

test CHANGED
File without changes
test CHANGED
@@ -88,7 +88,7 @@
88
88
 
89
89
  $(function () {
90
90
 
91
- $('.gnav__list--item').click(function () {
91
+ $('gnav-accordion--item').click(function () {
92
92
 
93
93
 
94
94
 
@@ -134,11 +134,11 @@
134
134
 
135
135
 
136
136
 
137
- gnav__list--itemクラス(li)をクリックした際にその下層にあるaccordion__lowクラス(ul要素)の中身がオープンされ、gnav-accordion--itemのアイコンも切り替わるコードを書きました。
137
+ gnav-accordion--itemクラス(li)をクリックした際にその下層にあるaccordion__lowクラス(ul要素)の中身がオープンされ、gnav-accordion--itemのアイコンも切り替わるコードを書きました。
138
138
 
139
139
 
140
140
 
141
- 現状、「レーザー飛蚊症治療」(.gnav__list--item)をクリックすると、「眼球注射治療(加齢黄斑変性など)」(.gnav__list--item)の下層メニューも同時に開いて、閉じてをしてしまいます。
141
+ 現状、「レーザー飛蚊症治療」(.gnav-accordion--item)をクリックすると、「眼球注射治療(加齢黄斑変性など)」(.gnav-accordion--item)の下層メニューも同時に開いて、閉じてをしてしまいます。
142
142
 
143
143
 
144
144
 

1

コードの訂正を行いました。

2020/12/16 01:43

投稿

Fukusuke0604
Fukusuke0604

スコア554

test CHANGED
File without changes
test CHANGED
@@ -12,13 +12,13 @@
12
12
 
13
13
  ```HTML
14
14
 
15
-
16
-
17
- <nav class="gnav">
15
+ <nav class="gnav">
18
16
 
19
17
  <ul class="gnav__list">
20
18
 
21
- <li class="gnav__list--item"><a href="../visit.html">専門性の高い治療<i class="fas fa-angle-down gnav__over-list--arrow-down gnav__over-list--arrow"></i></a>
19
+ <li class="gnav__list--item"><span class="gnav__list--item-varL"></span><a href="../doctor.html">院長ご挨拶・医師紹介<span class="gnav__list--item-var"></span></a></li>
20
+
21
+ <li class="gnav__list--item"><a href="../visit.html">専門性の高い治療<span class="gnav__list--item-var"></span><i class="fas fa-angle-down gnav__over-list--arrow-down gnav__over-list--arrow"></i></a>
22
22
 
23
23
  <ul class="gnav-accordion">
24
24
 
@@ -36,11 +36,17 @@
36
36
 
37
37
  </ul>
38
38
 
39
+ <!--accordion__low-->
40
+
39
41
  </li>
40
42
 
41
- <li class="gnav-accordion--item"><i class="fas fa-chevron-right gnav__over-list--arrow"></i>眼球注射治療(加齢黄斑変性など)
43
+ <!--gnav-accordion--item-->
42
44
 
45
+ <li class="gnav-accordion--item"><i class="fas fa-chevron-right gnav__over-list--arrow"></i>眼球注射治療<br>
46
+
47
+ (加齢黄斑変性など)
48
+
43
- <ul class="accordion__low">
49
+ <ul class="accordion__low">
44
50
 
45
51
  <li class="accordion__low-item"><a href="#">ダミー記事</a></li>
46
52
 
@@ -50,11 +56,29 @@
50
56
 
51
57
  <li class="accordion__low-item"><a href="#">ダミー記事</a></li>
52
58
 
53
- </ul></li>
59
+ </ul>
60
+
61
+ <!--accordion__low-->
62
+
63
+ </li>
64
+
65
+ <!--gnav-accordion--item-->
66
+
67
+ </ul>
68
+
69
+ <!--gnav-accordion-->
70
+
71
+ </li>
72
+
73
+ <!--gnav__list--item-->
54
74
 
55
75
  </ul>
56
76
 
77
+ <!--gnav__list-->
78
+
57
79
  </nav>
80
+
81
+ <!--gnav-->
58
82
 
59
83
  ```
60
84
 
@@ -62,49 +86,49 @@
62
86
 
63
87
  ```jQuery
64
88
 
65
- $(function() {
89
+ $(function () {
66
90
 
67
- $('.gnav__list--item').click(function(){
91
+ $('.gnav__list--item').click(function () {
68
92
 
69
93
 
70
94
 
71
- //メニューバーが閉じているなら
95
+ //メニューバーが閉じているなら
72
96
 
73
- if($('.accordion__low').hasClass('open')){
97
+ if ($('.accordion__low').hasClass('open')) {
74
98
 
75
- $('.accordion__low').removeClass('open');
99
+ $('.accordion__low').removeClass('open');
76
100
 
77
- $('.accordion__low').slideDown();
101
+ $('.accordion__low').slideDown();
78
102
 
79
- //fontawesome下向き矢印にする
103
+ //fontawesome下向き矢印にする
80
104
 
81
- $('.gnav-accordion--item').children('i').removeClass()
105
+ $('.gnav-accordion--item').children('i').removeClass()
82
106
 
83
- .addClass('fas fa-chevron-down');
107
+ .addClass('fas fa-chevron-down');
84
108
 
85
- }
109
+ }
86
110
 
87
-
88
111
 
89
- //メニューバーが開いているなら
90
112
 
91
- else{
113
+ //メニューバーが開いているなら
92
114
 
93
- $('.accordion__low').addClass('open');
115
+ else {
94
116
 
95
- $('.accordion__low').slideUp();
117
+ $('.accordion__low').addClass('open');
96
118
 
97
- //fontawesome右向き矢印にする
119
+ $('.accordion__low').slideUp();
98
120
 
99
- $('.gnav-accordion--item').children('i').removeClass()
121
+ //fontawesome右向き矢印にする
100
122
 
101
- .addClass('fas fa-chevron-right');
123
+ $('.gnav-accordion--item').children('i').removeClass()
102
124
 
103
- }
125
+ .addClass('fas fa-chevron-right');
104
126
 
105
- });
127
+ }
106
128
 
107
- });
129
+ });
130
+
131
+ });
108
132
 
109
133
  ```
110
134
 
@@ -121,3 +145,9 @@
121
145
  クリックしたメニューだけにアコーディオンを動作させる方法を教えてください。
122
146
 
123
147
  よろしくお願いします。
148
+
149
+
150
+
151
+
152
+
153
+ ```