回答編集履歴

2

読みやすく修正。

2020/04/28 09:11

投稿

kei344
kei344

スコア69442

test CHANGED
@@ -162,8 +162,6 @@
162
162
 
163
163
  $('html').addClass("is-fixed");
164
164
 
165
-
166
-
167
165
  }
168
166
 
169
167
  });

1

情報の追加。

2020/04/28 09:11

投稿

kei344
kei344

スコア69442

test CHANGED
@@ -101,3 +101,75 @@
101
101
  </script>
102
102
 
103
103
  ```**動くサンプル:**[https://jsfiddle.net/nuh4Lmva/](https://jsfiddle.net/nuh4Lmva/)
104
+
105
+
106
+
107
+ ---
108
+
109
+
110
+
111
+ ちなみにscript要素は分割しても特に利点も無いので、まとめたほうが良いです。
112
+
113
+ `$(function() {});`も複数個所に書く必要は無いと思います。
114
+
115
+
116
+
117
+ ```HTML
118
+
119
+ <script>
120
+
121
+ $(function() {
122
+
123
+ var scrollPos;
124
+
125
+ $('.navbar-toggler').on('click', function() {
126
+
127
+ scrollPos = $(window).scrollTop();
128
+
129
+ var target = $(this).data('modaibody');
130
+
131
+ $('.modal-bg').addClass('is-show');
132
+
133
+ $('#' + target).addClass('is-show');
134
+
135
+ $("#nav-content").fadeIn(100).addClass("open");
136
+
137
+ });
138
+
139
+ $('.modal-close').on('click', function() {
140
+
141
+ $('html').removeClass('is-fixed');
142
+
143
+ $('.modal-bg').removeClass('is-show');
144
+
145
+ $('.modal-body').removeClass('is-show');
146
+
147
+ $(window).scrollTop(scrollPos);
148
+
149
+ $("#nav-content").fadeOut(100).removeClass("open");
150
+
151
+ });
152
+
153
+ $("#nav-open").on("click", function () {
154
+
155
+ if ($('html').hasClass("is-fixed")) {
156
+
157
+ $('html').removeClass("is-fixed");
158
+
159
+ $("#nav-content").removeClass("open").fadeOut(100);
160
+
161
+ } else {
162
+
163
+ $('html').addClass("is-fixed");
164
+
165
+
166
+
167
+ }
168
+
169
+ });
170
+
171
+ });
172
+
173
+ </script>
174
+
175
+ ```