I took the slider from http://kenwheeler.imtqy.com/slick/ Autostart and Fade. When I replaced it with my pictures, then everything works for me, but how can I make the slider not stop when pointing the mouse at it?

$(document).ready(function(){ $('.foot').slick({ slidesToShow: 1, slidesToScroll: 1, autoplay: true, autoplaySpeed: 2000, dots: true, infinite: true, speed: 500, fade: true, cssEase: 'linear' }); }); 
  body { background: #20262E; padding: 20px; } nav{ background-color:#B85900; } nav ul { padding:0; margin:0; list-style: none; } nav ul li { margin: 0px -7px 0 0; display:inline-block; } nav a { display:block; color:#FFD700; font-size:20px; margin-left: 35px; } nav a:hover { color:#05A4B4; } 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="GLAV.css"> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.css"> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.min.css"> <script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js"></script> <script type="text/javascript" src="preloader.js"></script> </head> <body> <div class="menu"> <div class="text_perehod"> <nav> <ul> <img src="gold.jpg" style="width:30px; height:28px; "> <li style="font-size:20px; color:#FFD700;">Golden horseshoe!</li> <li><a href="#">Главная</a></li> <li><a href="#">Меню</a></li> <li><a href="#">Наше расположение</a></li> <li><a href="#"><img src="icons8-vk.com-filled-32.png"></a></li> <li><a href="#"><img src="icons8-instagram-32.png"></a></li> <li><a href="#"><img src="icons8-facebook-32.png"></a></li> <li><a href="#"><img src="icons8-твиттер-filled-32.png"></a></li> </ul></nav> </div> </div> <!-- Слайдер в начале --> <div class="foot" style="width:1600px; height:500px;"> <div><img src="food-photography-sea-food-close-up-1024x677.jpg"></div> <div><img src="1418305970.jpg"></div> <div><img src="personal_502.jpg"></div> </div> </body> </html>

  • 2
    pauseOnFocus there is everything in the documentation? why not read? - NeedHate
  • I did not understand what was written there and how to do it - Ivan
  • The first comment has already been written, put pauseOnFocus: false - Nilsan

1 answer 1

It is necessary to add the following to the slick-slider option:

 pauseOnHover: false, pauseOnFocus: false,