teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

3

閉じてみましたが、合っていますでしょうか。。。最新版だとswiper-containerではなくswiperみたいなので、containerを外してみました。

2021/10/18 11:09

投稿

KOI02
KOI02

スコア1

title CHANGED
File without changes
body CHANGED
@@ -116,96 +116,96 @@
116
116
  ```JavaScript
117
117
 
118
118
  $( function() {
119
- const swiper = new Swiper('.swiper-container1', {
119
+ const swiper = new Swiper('.swiper1', {
120
-
121
- speed: 600,
122
- autoplay:true,
123
- loop: true,
124
-
125
- pagination: {
126
- el: '.swiper-pagination',
127
- },
128
-
129
- // Navigation arrows
130
- navigation: {
131
- nextEl: '.swiper-button-next',
132
- prevEl: '.swiper-button-prev',
133
- },
134
- },
135
-
136
- const swiper = new Swiper('.swiper-container2', {
137
-
138
120
  speed: 600,
139
- autoplay:true,
121
+ autoplay: true,
140
122
  loop: true,
141
-
123
+
142
124
  pagination: {
143
- el: '.swiper-pagination',
125
+ el: '.swiper-pagination',
144
126
  },
145
- },
127
+
146
-
147
128
  // Navigation arrows
148
129
  navigation: {
149
- nextEl: '.swiper-button-next',
130
+ nextEl: '.swiper-button-next',
150
- prevEl: '.swiper-button-prev',
131
+ prevEl: '.swiper-button-prev',
151
132
  },
133
+ }
152
- },
134
+ ),
153
135
 
136
+ const swiper = new Swiper('.swiper2', {
137
+ speed: 600,
138
+ autoplay: true,
139
+ loop: true,
154
140
 
155
- const swiper = new Swiper('.swiper-container3', {
156
-
157
- speed: 600,
158
- autoplay:true,
159
- loop: true,
160
-
161
- pagination: {
141
+ pagination: {
162
- el: '.swiper-pagination',
142
+ el: '.swiper-pagination',
163
- },
143
+ },
164
-
165
- // Navigation arrows
166
- navigation: {
167
- nextEl: '.swiper-button-next',
168
- prevEl: '.swiper-button-prev',
169
- },
170
- },
171
144
 
172
- const swiper = new Swiper('.swiper-container4', {
145
+ // Navigation arrows
173
-
174
- speed: 600,
175
- autoplay:true,
176
- loop: true,
177
-
178
- pagination: {
146
+ navigation: {
179
- el: '.swiper-pagination',
147
+ nextEl: '.swiper-button-next',
148
+ prevEl: '.swiper-button-prev',
180
- },
149
+ },
150
+ }
181
- },
151
+ ),
182
-
183
- // Navigation arrows
184
- navigation: {
185
- nextEl: '.swiper-button-next',
186
- prevEl: '.swiper-button-prev',
187
- },
188
- },
189
152
 
190
- const swiper = new Swiper('.swiper-container5', {
191
-
192
- speed: 600,
193
- autoplay:true,
194
- loop: true,
195
-
196
- pagination: {
197
- el: '.swiper-pagination',
198
- },
199
-
200
- // Navigation arrows
201
- navigation: {
202
- nextEl: '.swiper-button-next',
203
- prevEl: '.swiper-button-prev',
204
- },
205
- },
206
- } );
207
153
 
154
+ const swiper = new Swiper('.swiper4', {
155
+ speed: 600,
156
+ autoplay: true,
157
+ loop: true,
208
158
 
159
+ pagination: {
160
+ el: '.swiper-pagination',
161
+ },
162
+
163
+ // Navigation arrows
164
+ navigation: {
165
+ nextEl: '.swiper-button-next',
166
+ prevEl: '.swiper-button-prev',
167
+ },
168
+ }
169
+ ),
170
+
171
+
172
+ const swiper = new Swiper('.swiper5', {
173
+ speed: 600,
174
+ autoplay: true,
175
+ loop: true,
176
+
177
+ pagination: {
178
+ el: '.swiper-pagination',
179
+ },
180
+
181
+ // Navigation arrows
182
+ navigation: {
183
+ nextEl: '.swiper-button-next',
184
+ prevEl: '.swiper-button-prev',
185
+ },
186
+ }
187
+ ),
188
+
189
+
190
+ const swiper = new Swiper('.swiper6', {
191
+ speed: 600,
192
+ autoplay: true,
193
+ loop: true,
194
+
195
+ pagination: {
196
+ el: '.swiper-pagination',
197
+ },
198
+
199
+ // Navigation arrows
200
+ navigation: {
201
+ nextEl: '.swiper-button-next',
202
+ prevEl: '.swiper-button-prev',
203
+ },
204
+ }
205
+ )
206
+ }),
207
+
208
+
209
209
  ```
210
210
 
211
211
 

2

JSの括弧を修正

2021/10/18 11:09

投稿

KOI02
KOI02

スコア1

title CHANGED
File without changes
body CHANGED
@@ -131,6 +131,7 @@
131
131
  nextEl: '.swiper-button-next',
132
132
  prevEl: '.swiper-button-prev',
133
133
  },
134
+ },
134
135
 
135
136
  const swiper = new Swiper('.swiper-container2', {
136
137
 
@@ -141,12 +142,14 @@
141
142
  pagination: {
142
143
  el: '.swiper-pagination',
143
144
  },
145
+ },
144
146
 
145
147
  // Navigation arrows
146
148
  navigation: {
147
149
  nextEl: '.swiper-button-next',
148
150
  prevEl: '.swiper-button-prev',
149
151
  },
152
+ },
150
153
 
151
154
 
152
155
  const swiper = new Swiper('.swiper-container3', {
@@ -164,6 +167,7 @@
164
167
  nextEl: '.swiper-button-next',
165
168
  prevEl: '.swiper-button-prev',
166
169
  },
170
+ },
167
171
 
168
172
  const swiper = new Swiper('.swiper-container4', {
169
173
 
@@ -174,12 +178,14 @@
174
178
  pagination: {
175
179
  el: '.swiper-pagination',
176
180
  },
181
+ },
177
182
 
178
183
  // Navigation arrows
179
184
  navigation: {
180
185
  nextEl: '.swiper-button-next',
181
186
  prevEl: '.swiper-button-prev',
182
187
  },
188
+ },
183
189
 
184
190
  const swiper = new Swiper('.swiper-container5', {
185
191
 
@@ -196,6 +202,7 @@
196
202
  nextEl: '.swiper-button-next',
197
203
  prevEl: '.swiper-button-prev',
198
204
  },
205
+ },
199
206
  } );
200
207
 
201
208
 

1

Markdown記法で再記しました!(過不足ありましたらご教授いただけますでしょうか。)是非ご尽力いただければ幸いです。

2021/10/18 04:44

投稿

KOI02
KOI02

スコア1

title CHANGED
File without changes
body CHANGED
@@ -13,7 +13,9 @@
13
13
  ```
14
14
 
15
15
  ### 該当のソースコード
16
- HTML
16
+ ```HTML
17
+
18
+
17
19
 
18
20
 
19
21
  <div class="swiper-container1">
@@ -79,9 +81,11 @@
79
81
  </div>
80
82
  </div>
81
83
 
82
- ↓css```ここに言語を入力
83
- コード
84
+ ```
85
+
84
- `
86
+ ```CSS
87
+ @charset "UTF-8";
88
+
85
89
  .swiper-container{
86
90
  width: 100%;
87
91
  margin: 30px auto;
@@ -107,9 +111,10 @@
107
111
  margin: 0 10px;
108
112
  }
109
113
 
110
- ↓JS```ここに言語を入力
114
+
111
- コード
112
115
  ```
116
+ ```JavaScript
117
+
113
118
  $( function() {
114
119
  const swiper = new Swiper('.swiper-container1', {
115
120
 
@@ -194,7 +199,11 @@
194
199
  } );
195
200
 
196
201
 
202
+ ```
197
203
 
204
+
205
+
206
+
198
207
  ### 試したこと
199
208
  ネット検索して方々試しましたが、初心者故わかりませんでした。。。
200
209