質問編集履歴

3

修正

2020/06/20 12:31

投稿

welcome
welcome

スコア10

test CHANGED
File without changes
test CHANGED
@@ -104,6 +104,8 @@
104
104
 
105
105
  <!--— サムネイル ---->
106
106
 
107
+ 下記のように出力したい。
108
+
107
109
  <ul class="thumb-list">
108
110
 
109
111
 
@@ -138,9 +140,135 @@
138
140
 
139
141
 
140
142
 
143
+
144
+
145
+
146
+
141
147
  ```ここに言語を入力
142
148
 
149
+ やりたいこと!
150
+
151
+ サムネイル部分
152
+
153
+ <ul>
154
+
155
+ <li class="thumb-item">
156
+
157
+ <a class="thumb-link two" href="javascript:void(0);" onclick="slideThumb(1)">
158
+
159
+ <img src=" " >
160
+
161
+ </a>
162
+
163
+ </li>
164
+
165
+ <li class="thumb-item">
166
+
167
+ <a class="thumb-link two" href="javascript:void(0);" onclick="slideThumb(2)">
168
+
169
+ <img src=" " >
170
+
171
+ </a>
172
+
173
+ </li>
174
+
175
+ <li class="thumb-item">
176
+
177
+ <a class="thumb-link three" href="javascript:void(0);" onclick="slideThumb(3)">
178
+
179
+ <img src=" " >
180
+
181
+ </a>
182
+
183
+ </li>
184
+
185
+ <li class="thumb-item">
186
+
187
+ <a class="thumb-link four" href="javascript:void(0);" onclick="slideThumb(4)">
188
+
189
+ <img src=" " >
190
+
191
+ </a>
192
+
193
+ </li>
194
+
195
+ <li class="thumb-item">
196
+
197
+ <a class="thumb-link five" href="javascript:void(0);" onclick="slideThumb(5)">
198
+
199
+ <img src=" " >
200
+
201
+ </a>
202
+
203
+ </li>
204
+
205
+ <li class="thumb-item">
206
+
207
+ <a class="thumb-link six" href="javascript:void(0);" onclick="slideThumb(6)">
208
+
209
+ <img src=" " >
210
+
211
+ </a>
212
+
213
+ </li>
214
+
215
+ <li class="thumb-item">
216
+
217
+ <a class="thumb-link seven" href="javascript:void(0);" onclick="slideThumb(7)">
218
+
219
+ <img src=" " >
220
+
221
+ </a>
222
+
223
+ </li>
224
+
225
+ <li class="thumb-item">
226
+
227
+ <a class="thumb-link eight" href="javascript:void(0);" onclick="slideThumb(8)">
228
+
229
+ <img src=" " >
230
+
231
+ </a>
232
+
233
+ </li>
234
+
235
+ <li class="thumb-item">
236
+
237
+ <a class="thumb-link nine" href="javascript:void(0);" onclick="slideThumb(9)">
238
+
239
+ <img src=" " >
240
+
241
+ </a>
242
+
243
+ </li>
244
+
245
+ <li class="thumb-item">
246
+
247
+ <a class="thumb-link ten" href="javascript:void(0);" onclick="slideThumb(10)">
248
+
249
+ <img src=" " >
250
+
251
+ </a>
252
+
253
+ </li>
254
+
255
+ </ul>
256
+
257
+
258
+
259
+ ```
260
+
261
+
262
+
263
+
264
+
265
+
266
+
267
+
268
+
269
+ ```ここに言語を入力
270
+
143
- jQueryとswiper.jsを読み込んだ後に下記を記述しています。
271
+ jQueryとswiper.jsを読み込んだ後に下記を記述しています。あんまり関係ないかもですが念のため表記してます。
144
272
 
145
273
  function slideThumb(index) {
146
274
 

2

説明の修正を行いました

2020/06/20 12:31

投稿

welcome
welcome

スコア10

test CHANGED
File without changes
test CHANGED
@@ -32,11 +32,27 @@
32
32
 
33
33
  一ずつ足した数字を挿入できたらいいと考えました。
34
34
 
35
+ foreach文に中で1ずつプラスされた数字がslideThumb( )の()内に挿入できれば解決しそうです。
36
+
37
+ 以下のコードのように試してみたのですが、同じ数字である2しか取得できません。
38
+
39
+ slideThumb( )の()内に1,2,3,4,5,6,,,,というように挿入できたら理想なのですが、
40
+
41
+ うまくいきませんでした。
35
42
 
36
43
 
37
- しかし、うまくいきません。
38
44
 
45
+ つまり、
39
46
 
47
+ やりたいことは
48
+
49
+ サムネイルの1枚目の時はaタグ内のonclick="slideThumb(1)
50
+
51
+ サムネイルの2枚目の時はaタグ内のonclick="slideThumb(2)
52
+
53
+ ,,,といったようにphpでfor文やforeach文を回して、プラス一ずつされた数字が挿入できたら
54
+
55
+ スライダーとサムネイルが連動して動いてくれます。
40
56
 
41
57
  どなたかご教授いただけませんでしょうか。
42
58
 

1

JSの記述を追加

2020/06/20 12:26

投稿

welcome
welcome

スコア10

test CHANGED
File without changes
test CHANGED
@@ -119,3 +119,17 @@
119
119
  </ul>
120
120
 
121
121
  ```
122
+
123
+
124
+
125
+ ```ここに言語を入力
126
+
127
+ jQueryとswiper.jsを読み込んだ後に下記を記述しています。
128
+
129
+ function slideThumb(index) {
130
+
131
+ swiperMain.slideTo(index);
132
+
133
+ }
134
+
135
+ ```