質問編集履歴
2
spMenu.jsを修正
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -110,7 +110,9 @@
|
|
|
110
110
|
|
|
111
111
|
```javascript
|
|
112
112
|
|
|
113
|
-
document.getElementByClassName('menu-trigger')
|
|
113
|
+
var element = document.getElementsByClassName('menu-trigger')[0];
|
|
114
|
+
|
|
115
|
+
element.addEventListener("click", function(e) {
|
|
114
116
|
|
|
115
117
|
if($(this).hasClass('active')){
|
|
116
118
|
|
|
@@ -132,7 +134,9 @@
|
|
|
132
134
|
|
|
133
135
|
}
|
|
134
136
|
|
|
135
|
-
document.getElementByClassName('overlay')
|
|
137
|
+
var element = document.getElementsByClassName('overlay')[0];
|
|
138
|
+
|
|
139
|
+
element.addEventListener("click", function(e) {
|
|
136
140
|
|
|
137
141
|
if($(this).hasClass('open')){
|
|
138
142
|
|
1
functions.phpの記述が不要だったため削除、contact.phpでのjsファイル呼び出しを追加、spMenu.jsを変更、本来やりたいscript記述を追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
<contact.php（
|
|
15
|
+
<contact.php（body最下部でjsファイル呼び出し）>
|
|
16
16
|
|
|
17
17
|
```php
|
|
18
18
|
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
|
|
93
93
|
</div>
|
|
94
94
|
|
|
95
|
-
|
|
95
|
+
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/spMenu.js"></script>
|
|
96
96
|
|
|
97
97
|
<?php wp_footer(); ?>
|
|
98
98
|
|
|
@@ -106,37 +106,11 @@
|
|
|
106
106
|
|
|
107
107
|
|
|
108
108
|
|
|
109
|
-
<function.php（ドメイン/wp/wp-content/themes/テーマ名/）>
|
|
110
|
-
|
|
111
|
-
```php
|
|
112
|
-
|
|
113
|
-
<
|
|
109
|
+
<spMenu.js（試してみたこと）>
|
|
114
|
-
|
|
115
|
-
// spMenu
|
|
116
|
-
|
|
117
|
-
function spMenu() {
|
|
118
|
-
|
|
119
|
-
wp_enqueue_script('spMenu', get_template_directory_uri() . '/js/spMenu.js'
|
|
120
|
-
|
|
121
|
-
);
|
|
122
|
-
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
add_action( 'wp_enqueue_scripts', 'spMenu' );
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
```
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
<spMenu.js（ドメイン/wp/wp-content/themes/テーマ名/js/）>
|
|
136
110
|
|
|
137
111
|
```javascript
|
|
138
112
|
|
|
139
|
-
|
|
113
|
+
document.getElementByClassName('menu-trigger').onclick = function() {
|
|
140
114
|
|
|
141
115
|
if($(this).hasClass('active')){
|
|
142
116
|
|
|
@@ -156,9 +130,9 @@
|
|
|
156
130
|
|
|
157
131
|
}
|
|
158
132
|
|
|
159
|
-
}
|
|
133
|
+
}
|
|
160
134
|
|
|
161
|
-
|
|
135
|
+
document.getElementByClassName('overlay').onclick = function() {
|
|
162
136
|
|
|
163
137
|
if($(this).hasClass('open')){
|
|
164
138
|
|
|
@@ -170,7 +144,55 @@
|
|
|
170
144
|
|
|
171
145
|
}
|
|
172
146
|
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
```
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
|
|
153
|
+
<正常にハンバーガーメニューが起動したscript記述（HTML一部抜粋）※本来spMenu.jsでやりたいこと>
|
|
154
|
+
|
|
155
|
+
```html
|
|
156
|
+
|
|
157
|
+
<script>
|
|
158
|
+
|
|
159
|
+
$('.menu-trigger').on('click',function(){
|
|
160
|
+
|
|
161
|
+
if($(this).hasClass('active')){
|
|
162
|
+
|
|
163
|
+
$(this).removeClass('active');
|
|
164
|
+
|
|
165
|
+
$('.navSp').removeClass('open');
|
|
166
|
+
|
|
167
|
+
$('.overlay').removeClass('open');
|
|
168
|
+
|
|
169
|
+
} else {
|
|
170
|
+
|
|
171
|
+
$(this).addClass('active');
|
|
172
|
+
|
|
173
|
+
$('.navSp').addClass('open');
|
|
174
|
+
|
|
175
|
+
$('.overlay').addClass('open');
|
|
176
|
+
|
|
177
|
+
}
|
|
178
|
+
|
|
173
|
-
});
|
|
179
|
+
});
|
|
180
|
+
|
|
181
|
+
$('.overlay').on('click',function(){
|
|
182
|
+
|
|
183
|
+
if($(this).hasClass('open')){
|
|
184
|
+
|
|
185
|
+
$(this).removeClass('open');
|
|
186
|
+
|
|
187
|
+
$('.menu-trigger').removeClass('active');
|
|
188
|
+
|
|
189
|
+
$('.navSp').removeClass('open');
|
|
190
|
+
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
});
|
|
194
|
+
|
|
195
|
+
</script>
|
|
174
196
|
|
|
175
197
|
|
|
176
198
|
|