こちらのslickスライダーを使っています。
http://kenwheeler.github.io/slick/
以下のように、オプションをつけて、使用しています。
JavaScript
1 $('.slider').slick({ 2 arrows: false, 3 infinite: true, 4 autoplay: true, 5 autoplaySpeed: 0, 6 cssEase: 'linear', 7 speed: 5000, 8 slidesToShow: 7, 9 slidesToScroll: 1, 10 variableWidth: true, 11 lazyLoad: 'progressive', 12 }); 13
※こちらは、以下の記事を参考にさせていただきました。
http://www.kopjapan.com/blog/web/jquery%E3%81%A7%E7%94%BB%E5%83%8F%E3%82%92%E5%8F%B3%E3%81%8B%E3%82%89%E5%B7%A6%E3%81%B8%E7%84%A1%E9%99%90%E3%83%AB%E3%83%BC%E3%83%97%E3%81%A7%E6%B5%81%E3%81%97%E7%B6%9A%E3%81%91%E3%82%8B%E3%82%A2
基本的には動作しているのですが、どうも「最初にロードしたときだけ」しばらく数秒ほど動き(スライドする速度)が速いのです。
まるで、「開始地点」に急いで戻るように動き、その後設定したスピードで流れ始めます。
これを解消する手段がわからないのですが、どなたかご存知でしょうか。
なお、LazyLoadで全部の読込が終わってから
JavaScript
1$('.slider').slick("slickPlay");
としても、同じ現象が発生しました。
画像がロード済みでないことが原因ではないようです。
よろしくお願いします。
回答2件
あなたの回答
tips
プレビュー