前提・実現したいこと
slickで自動再生のスライダーを作っています。
発生している問題・エラーメッセージ
が、3回に1回くらい、マウスホバーするとスライダーが止まってしまいます。。。
特に関係ありそうなものは出ていませんが、 Mixed Content: The page at 'https:~' was loaded over HTTPS, but requested an insecure image 'http:~'. This content should also be served over HTTPS. こちらのfavicon、fontは全て出ています。 (しかし、favicon/fontの設定はないですし、imgも相対パスなので関係ないと思うのですが。。。)
該当のソースコード
html
1<head> 2<link rel="stylesheet" href="js/slick.css"> 3<link rel="stylesheet" href="js/slick-theme.css"> 4<script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> 5</head> 6<ul id="slider"> 7 <li><img src="img/slider/01.jpg"></li> 8 <li><img src="img/slider/02.jpg"></li> 9 <li><img src="img/slider/03.jpg"></li> 10 <li><img src="img/slider/04.jpg"></li> 11 <li><img src="img/slider/05.jpg"></li> 12 <li><img src="img/slider/06.jpg"></li> 13 <li><img src="img/slider/07.jpg"></li> 14 <li><img src="img/slider/08.jpg"></li> 15 <li><img src="img/slider/09.jpg"></li> 16 <li><img src="img/slider/10.jpg"></li> 17 <li><img src="img/slider/11.jpg"></li> 18 <li><img src="img/slider/12.jpg"></li> 19 <li><img src="img/slider/13.jpg"></li> 20 <li><img src="img/slider/14.jpg"></li> 21</ul> 22. 23. 24. 25 26<script src="js/slick.min.js"></script> 27<script src="js/common.js"></script> 28</body> 29
js
1$(function(){ 2 $('#slider').slick({ 3 arrows: true, 4 autoplay: true, 5 slidesToShow: 7, 6 autoplaySpeed: 0, 7 cssEase: 'linear', 8 speed: 5000, 9 slidesToScroll: 1, 10 infinite: true, 11 pauseOnFocus: false, 12 pauseOnHover: false, 13 responsive: [{ 14 breakpoint: 768, 15 settings: { 16 slidesToShow: 4 17 } 18 } 19 ] 20 }); 21}); 22
試したこと
初心者なので、
pauseOnFocus: false,
pauseOnHover: false,
を入れるところくらいまでしか追いかけられませんでした。
※slickのファイルは最新のものをDLしています。
皆さまお忙しい中とは思いますが、どうぞよろしくお願いいたします。
補足情報(FW/ツールのバージョンなど)
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/06/16 05:42