質問編集履歴
4
表題を変更しました。slickに拘らず何か方法は無いかヒントを頂けますと幸いです。
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
|
|
1
|
+
スライドショーをひとつのスライドショーにまとめる方法が知りたいです。
|
body
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
初心者につき、至らない点ばかりかと思いますが、
|
|
2
|
-
|
|
1
|
+
何か少しでもヒントを頂けますと嬉しいです。
|
|
3
2
|
|
|
4
|
-
# スライドショーの切り替え
|
|
3
|
+
# スライドショーの切り替えについて
|
|
5
4
|
静的HTMLにslickを使ってスライドショーを実装しています。
|
|
6
5
|
https://teratail.com/questions/202267
|
|
7
6
|
↑こちらを参考にさせていただきました。
|
3
試したことを追記させて頂きました。もしかしてそもそも間違っていたんじゃないかと怖くなってきました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,10 +1,7 @@
|
|
|
1
1
|
初心者につき、至らない点ばかりかと思いますが、
|
|
2
2
|
お知恵を貸して頂けますと幸いです。
|
|
3
3
|
|
|
4
|
-
#
|
|
4
|
+
# スライドショーの切り替えの制御について
|
|
5
|
-
・PC Windows
|
|
6
|
-
・VScode
|
|
7
|
-
|
|
8
5
|
静的HTMLにslickを使ってスライドショーを実装しています。
|
|
9
6
|
https://teratail.com/questions/202267
|
|
10
7
|
↑こちらを参考にさせていただきました。
|
|
@@ -18,7 +15,7 @@
|
|
|
18
15
|
2 (A)をさらにひとつのスライドショーにまとめ、スライド出来るようにする。
|
|
19
16
|
|
|
20
17
|
|
|
21
|
-
|
|
18
|
+
##現在のエラーと分からないこと
|
|
22
19
|
・4つ用意したが、二個目以降のスライドショーのプログレスバーが動かない。
|
|
23
20
|
・とりあえず形になってほしい気持ちから4つのスライダーを「big-slider」に変えてJSの方に追記したところ、大カオスな状態になった。
|
|
24
21
|
・仮に上記が解決されたとしてこの計画では、画像切替ボタンも動いてしまう。操作ボタンは、動かないでほしいのです。
|
|
@@ -37,7 +34,8 @@
|
|
|
37
34
|
});
|
|
38
35
|
```
|
|
39
36
|
|
|
37
|
+
---
|
|
40
|
-
|
|
38
|
+
** 該当のソースコード**
|
|
41
39
|
|
|
42
40
|
```html
|
|
43
41
|
<!DOCTYPE html>
|
|
@@ -280,17 +278,27 @@
|
|
|
280
278
|
// nextArrow: '<img src="https://dummyimage.com/100x100/fff/000&text=Next" class="slide-arrow slick-next">',
|
|
281
279
|
// adaptiveHeight: true
|
|
282
280
|
// }).on('afterChange', function(event, slick, currentSlide) {
|
|
283
|
-
// if (currentSlide === 0)
|
|
281
|
+
// if (currentSlide === 0)### ヘディングのテキスト
|
|
284
282
|
// $('.bar').css({width: 0});
|
|
285
283
|
// $('.bar').startBar(currentSlide);
|
|
286
284
|
// });
|
|
287
285
|
|
|
288
286
|
```
|
|
289
287
|
|
|
288
|
+
**環境**
|
|
289
|
+
- PC：Windows
|
|
290
|
+
- エディタ：VScode
|
|
291
|
+
|
|
290
292
|
### 試したこと
|
|
291
|
-
|
|
293
|
+
0. デバッグツールで表示されてるエラーとにらめっこしていたのですが、
|
|
292
294
|
エラーがなくなっても解決されなかったので、質問させて頂きました。
|
|
293
|
-
|
|
295
|
+
0. JS内のcode記載する順番が悪いのだろうかと思い、前後させてみましたが、うまくいきませんでした。
|
|
296
|
+
0. https://webcode-lab.com/topics/blogid/8/
|
|
297
|
+
を参考にさせて頂き、「$() 関数」が競合云々という問題じゃないということが分かりました。
|
|
294
298
|
|
|
299
|
+
---
|
|
300
|
+
［現在…］
|
|
301
|
+
アドバイス頂いた「任意で切り替え」を自分なりに解釈し、そもそもこれをslickでやろうとしていること自体が問題なのではないか？と思いはじめて来たのですが、皆様のご意見を頂けますと幸いです。
|
|
302
|
+
|
|
295
303
|
もし、必要な情報がありましたら、追記させていただきます。
|
|
296
304
|
宜しくお願いします。
|
2
試したことを追記しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -288,8 +288,9 @@
|
|
|
288
288
|
```
|
|
289
289
|
|
|
290
290
|
### 試したこと
|
|
291
|
-
デバッグツールで表示されてるエラーとにらめっこしていたのですが、
|
|
291
|
+
・デバッグツールで表示されてるエラーとにらめっこしていたのですが、
|
|
292
292
|
エラーがなくなっても解決されなかったので、質問させて頂きました。
|
|
293
|
+
・JSを記載する順番が悪いのだろうかと思い、前後させてみましたが、うまくいきませんでした。
|
|
293
294
|
|
|
294
295
|
もし、必要な情報がありましたら、追記させていただきます。
|
|
295
296
|
宜しくお願いします。
|
1
最初の一文「初心者につき、至らない点ばかりかと思いますが、お知恵を貸して頂けますと幸いです。」です。編集ページでは上手く表示されているのですが…しょっぱなから見にくくすみません…
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
初心者につき、至らない点ばかりかと思いますが、
|
|
1
|
+
初心者につき、至らない点ばかりかと思いますが、
|
|
2
|
+
お知恵を貸して頂けますと幸いです。
|
|
2
3
|
|
|
3
4
|
### 前提・実現したいこと
|
|
4
5
|
・PC Windows
|