<!-- Стили слайдера-->
<!-- Тут ничего не меняешь-->
<!-- Стили плагина owl carousel-->
<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">
1
2
3
4
5
6
7
3
5
7 
<!-- Область слайдера 1-->
<!-- В этом блоке будут плавать твои слайды или скрытые блоки -->
<div class="tabs-slider-wrapper"></div>
1
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
2
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
3
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
4
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
5
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
6
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
seven
seven
7
Вкладка номер семь
<!-- Скрипт плагина owl carousel-->
<!-- Тут ничего не меняешь-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

<!-- Тут вставляешь id блоков-->
<script>
  $(document).ready(function() {
    var block = $('#rec302463161'); //id  т123 область слайдера (тот т123 который был выше)
    var wrap = $('.tabs-slider-wrapper');
    var slides = $('#rec302459715, #rec302459762, #rec302459773, #rec302459776, #rec302459784, #rec302459804, #rec302467517'); // id Zero block слайдов (скрытых блоков)

//ниже ничего не меняешь
    wrap.append('<div class="owl-carousel owl-theme"></div>');
    slides.appendTo(block.find('.owl-carousel'));
    var owl = wrap.find('.owl-carousel').owlCarousel({
      loop: true,
      center: false,
      touchDrag: false,
      pullDrag: false,
      freeDrag: false,
      dots: false,
      center: false,
      nav: false,
      margin: 0,
      mouseDrag: false,
      touchDrag: false,
      autoHeight: true,
      URLhashListener: true,
      startPosition: 'URLHash',
      responsive: {
        0: {
          items: 1
        },
        640: {
          items: 1
        },
        1000: {
          items: 1
        },
      }
    })
  });
</script>
<!-- Тут пишешь id zero блоков, которые слайды и назначаешь им ссылки. 
Сейчас там стоят цифры, но тожешь что угодно в кавычки вписать
Потом по этой ссылке будет вызываться слайд
Ссылки быдут #1 или #seven или #tvoy-variant
Ссылку можешь зацепить за любую кнопку или что угодно
Пример вверху на основе меню и на основе zero
Скрытыми могут быть любые блоки, как зеро, так и обычные, пример блок 7-->

<script>
  //назначаем номера табов на нужные zero блоки слайды 2й карусели
  $("#rec302459715").attr("data-hash", "1");
  $("#rec302459762").attr("data-hash", "2");
  $("#rec302459773").attr("data-hash", "3");
  $("#rec302459776").attr("data-hash", "4");
  $("#rec303592087").attr("data-hash", "5");
  $("#rec303592088").attr("data-hash", "6");
  $("#rec302467517").attr("data-hash", "seven");
</script>
Made on
Tilda