Как сделать карусель-слайдер для сопутствующих товаров из блока ST305N в Tilda
    CHIC SCARF
    SKU: 01
    7000
    р.
    13000
    р.
    When we first checked out our new headphones, we noticed the box said 'improved bass by cool. We had to wonder, is this marketing jargon, or the real thing? But it only took a moment to realize that bass was not kidding.

    Category: Accessories
    Tags: New, Trendy
    RELATED PRODUCTS
    More products

    Как сделать карусель-слайдер для сопутствующих товаров из блока ST305N в Tilda

    1
    Добавили на страницу блок ST305N
    2
    Добавили в него 8 товаров
    3
    Сделали настройки: Кол-во блоков в ряду 4
    4
    Добавили скрипт на страницу
    Скрипт вставляется в блок ДРУГОЕ►Т123
    В коде заменили:
    //ID нашего блока с товарами
    //Прописываем ID нашего блока ************************************** $('#rec114249938')
    Библиотека для слайдера
    
    <!--Библиотеки для слайдера -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
    <script src="https://owlcarousel2.github.io/OwlCarousel2/assets/vendors/jquery.mousewheel.min.js"></script>
    <style>
    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
        background: #e18888;
    }
    .owl-theme .owl-dots .owl-dot { outline: none;}
    .owl-theme .owl-dots .owl-dot span {background: #f0f0f0;}
    .owl-prev , .owl-next{    display: none !important}
    @media screen and (max-width: 960px){
    .t776__col_mobile-grid { width: 100% !important; }
    .t776__col {margin-bottom: 10px  !important;}    
    }
    </style>
    <script>
        $(document).ready(function() {
         setTimeout(function() {  
         $('div.t776__separator , div.t-store__grid-separator').remove();
         $('.t776 .t-container').addClass('owl-carousel owl-theme');
        //ПРописываем ID нашего блока **************************************     
        $('#rec99883956').addClass('scrollowl autosliding');
        }, 300);
        setTimeout(function() { 
    var owl = $('.scrollowl .owl-carousel');
    owl.owlCarousel({
        loop:true,
        nav:true,
        margin:10,
        autoplay:true,
        autoplayTimeout:3000,
        autoplayHoverPause:true,
        responsive:{0:{ items:1 }, 480:{ items:2 }, 960:{ items:4 } }  });
    $('a[href="#leftsld"]').click(function(e) { e.preventDefault();  owl.trigger('next.owl');   });
      $('a[href="#rightsld"]').click(function(e) { e.preventDefault(); owl.trigger('prev.owl');  });
    owl.on('mousewheel', '.owl-stage', function (e) {
        if (e.deltaY>0) {  owl.trigger('next.owl');
        } else {  owl.trigger('prev.owl');  } e.preventDefault();
    });
    }, 600); });
    </script>
    
    Связаться с нами
    Если вы не нашли то что искали, хотите написать вопрос или предложение, отправьте их через форму ниже
    Made on
    Tilda