1

Тема: Не працює слайдер

Не працює слайдер

Після додавання частин слайдера в <div id="product-tab-1" сlass="tabs-content products_content tabs-content--active"> слайдер взагалі зник і перестав працювати. Допоможіть будьласка запустити слайдер,додав би сюди зразок сайту але тут немає такої функції, можу тільки код.

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/slick.css">
  <link rel="stylesheet" href="css/fonts.css">
  <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Barlow:wght@400;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>
  <header class="header">
   <div class="header_top">
  <div class="container">
<div class="header_top-inner">
  <nav class="menu">
    <ul class="menu_list">
      <li class="menu_item">
        <a class="menu_link" href="#">
        Магазины
        </a>
      </li>
      <li class="menu_item">
        <a class="menu_link" href="#">
        Акции
        </a>
      </li>
      <li class="menu_item">
        <a class="menu_link" href="#">
          Доставка и оплата       
        </a>
      </li>
    </ul>
  </nav>
 <a class="logo" href="#">
   <img class="logo_img" src="images/logo.svg" alt="">
 </a>
 <div class="header_box">
<p class="header_adress">
  Днепр,  ул. Науки  25
</p>
<ul class="user-list">
  <li class="user-list_item">
<a  class="user-list_link" href="#">
  <img src="images/heart.svg" alt="">
</a>
  </li>
  <li class="user-list_item">
<a class="user-list_link" href="#">
  <img src="images/user.svg" alt="">
</a>
  </li>
  <li class="user-list_item">
 <a class="user-list_link basket" href="#">
   <img src="images/basket.svg" alt="">
   <p class="basket_num">1</p>
 </a>   
  </li>
</ul>
 </div>
</div>
  </div>
   </div>
   <div class="header_bottom">
<div class="container">
       <ul class="menu-categories">
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Квадроциклы</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Катера</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Гидроциклы</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Лодки</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Вездеходы</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Снегоходы</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Двигатели</a>
    </li>
     <li class="menu-categories_item">
       <a  class="menu-categories_link" href="#">Запчасти</a>
    </li>
       </ul>
     </div>
</div>
  </header>
  <section class="banner-section page-section">
    <div class="container">
      <div class="banner-section_inner">
        <div class="banner-section_slider">
          <a class="banner-section_slider-item" href="#">
            <img  class="banner-section_slider-img" src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img  class="banner-section_slider-img"src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img class="banner-section_slider-img" src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img  class="banner-section_slider-img"src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img class="banner-section_slider-img" src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img class="banner-section_slider-img" src="images/banner-slider.jpg" alt="">
          </a>
          <a class="banner-section_slider-item" href="#">
            <img class="banner-section_slider-img" src="images/banner-slider.jpg" alt="">
        </a>
        </div>
        <a class="banner-section_item sale-item" href="#">
         <div class="sale-item_top">
           <p class="sale-item_info">
             акция
           </p>
           <div class="sale-item_price">
             <div class="price sale-item_price-new">190 000</div>
             <div class="price sale-item_price-old">226 000</div>
           </div>
         </div>
         <img class="sale-item_img" src="images/content/sale-1.png" alt="">
         <h5 class="sale-item_title">
           Лодочный мотор
           Suzuki DF9.98RS
         </h5>
         <P class="sale-item_footer">
           Акция действует до
           <span>31.08.2024</span>
         </P>
        </a>
      </div>
    </div>
  </section>

  <section class="search page-section">
    <div class="container">
      <div class="search_inner">
        <div class="search_tabs">
          <a  class="tab search_tabs-item tab--active" href="#tab-1">Поиск по номеру</a>
          <a  class="tab search_tabs-item" href="#tab-2">Поиск по марке</a>
          <a  class="tab search_tabs-item" href="#tab-3">Поиск по названию товара</a>
        </div>
        <div class="search_content">
          <div id="tab-1" class="tabs-content search_content-item tabs-content--active">
            <form class="search_content-form">
              <input  class="search_content-input" type="text" placeholder="Введите номер">
              <button class="search_content-btn"  type="submit">искать</button>
            </form>
          </div>
          <div id="tab-2" class="tabs-content search_content-item">
            <form class="search_content-form">
              <input  class="search_content-input" type="text" placeholder="Введите марку">
              <button class="search_content-btn"  type="submit">искать</button>
            </form>
          </div>
          <div id="tab-3" class="tabs-content search_content-item">
            <form class="search_content-form">
              <input  class="search_content-input" type="text" placeholder="Введите название товара">
              <button class="search_content-btn"  type="submit">искать</button>
            </form>
          </div>
      </div>
    </div>
    </div>
  </section>
    
  <section class="categories page-section">
   <div class="container">
     <div class="categories_inner">
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Квадроциклы</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-1.png" alt="">
        </div>
       </a>
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Гидроциклы</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-2.png" alt="">
        </div>
       </a>
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Катера</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-3.png" alt="">
        </div>
       </a>
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Снегоходы</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-4.png" alt="">
        </div>
       </a>
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Вездеходы</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-5.png" alt="">
        </div>
       </a>
       <a class="categories_item" href="#">
        <div class="categories_item-info">
          <h4 class="categories_item-title">Двигатели</h4>
          <p class="categories_item-text">Подробнее</p>
        </div>
        <div class="categories_item-img">
          <img src="images/categories-6.png" alt="">
        </div>
       </a>
     </div>
   </div>
  </section>

 <section class="products">
   <div class="container">
     <div class="products_inner">
       <h3 class="product_title">
         Популярные товары
       </h3>
       <div class="tabs-wrapper">
        <div class="tabs products_tabs">
          <a class="tab  products_tab tab--active" href="#product-tab-1">запчасти </a>
          <a class="tab  products_tab" href="#product-2">моторы</a>
          <a class="tab  products_tab" href="#product-3"> шины</a>
          <a class="tab  products_tab" href="#product-3"> электроника</a>
          <a class="tab  products_tab" href="#product-4"> инструменты</a>
          <a class="tab  products_tab" href="#product-5"> аксессуары</a>
        </div>
       </div>
      <div class="tabs-container products_container">
        <div id="product-tab-1" сlass="tabs-content products_content tabs-content--active">
          <div class="tabs-content products_content">
            <div class="product-slider">
              <div class="product-slider_item">
                <div class="product-item_wrapper">
                  <button class="product-item_favorite"></button>
                    <button class="product-item_basket">
                      <img src="images/basket-white.svg" alt="">
                      </button>
                      <a class="product-item product-item--sale" href="#">
                      <p class="product-item_hover-text">
                        посмотреть товар
                      </p>
                    <img class="product-item_img" src="images/content/product-1.png" alt="">
                    <h4 class="product-item_title">
                     Водонепронецаемый рюкзак
                    </h4>
                    <p class="price product-item_price"> 
                      9 800 ₴
                    </p>
                  </a>
                </div> 
              </div>
             </div>
             </div>
        <div id="product-tab-3" class="tabs-content products_content">slider-3</div>
        <div id="product-tab-4" class="tabs-content products_content">slider-4</div>
        <div id="product-tab-5" class="tabs-content products_content">slider-5</div>
        <div id="product-tab-6" class="tabs-content products_content">slider-6</div>
        <div id="product-tab-7" class="tabs-content products_content">slider-7</div>   
      </div>
    </div>
   </div>
  </div>
 </section>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="js/slick.min.js"></script>
  <script src="js/main.js"></script>
</body>
</html>

2

Re: Не працює слайдер

HTML - це просто розмітка. Щоб зрозуміти, як це працює, потрібні CSS і JavaScript.
І буде краще, якщо ви надішлете посилання на codepen або github.