Помогите разобраться с неработающим slick слайдером

Question

Помогите понять в чем причина

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Unity</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css">
  <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap" rel="stylesheet">
  <link rel="preconnect" href="https://fonts.gstatic.com"> 
  <link rel="stylesheet" type="text/css" href="css/slick.css">
  <link rel="stylesheet" type="text/css" href="css/reset.css">
  <link rel="stylesheet" type="text/css" href="css/global.css">
  <link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
   
  ...

  <div id="slider-block">
       <div class="slider__item"><img class="slider__pic" src="img/slider1.jpg" alt=""></div>
       <div class="slider__item"><img class="slider__pic" src="img/slider2.jpg" alt=""></div>
       <div class="slider__item"><img class="slider__pic" src="img/slider3.jpg" alt=""></div>
  </div>

   ...
  
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="js/jquery.fancybox-1.3.4/jquery-1.4.3.min.js"></script>
<script src="js/slick/slick.min.js"></script>
<script src="js/slider.js"></script>

</body>

#slider-block {
    display: flex; 
    justify-content: center;
}

.slider__pic {
    width: 90%;
    margin: 0 20px;
    cursor: pointer;
}

$(document).ready(function() {
    $('#slider-block').slick({
      slidesToShow: 3,
      slidesToScroll: 1,
      infinite: true,
      autoplay: true,
      autoplaySpeed: 2000,
    });
  });

БЛОГ НА HUSL

Помогите разобраться с неработающим slick слайдером

Ответы (0 шт):