Я взял слайдер с сайта http://kenwheeler.github.io/slick/ Автозапуск и Увядать. Когда заменил на свои картинки то у меня всё работает, но как сделать, чтобы слайдер при наводке на него мыши не останавливался?
$(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>
Нужно добавить в опции slick-slider следующее:
pauseOnHover: false,
pauseOnFocus: false,
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости