L
L
ldfofo2020-04-20 22:24:10
HTML
ldfofo, 2020-04-20 22:24:10

Two tilda html codes interrupt each other, what should I do?

I insert two codes per page on one zero-block.

Separately, they work fine, but if I include both, then the code with the slider is buggy and abruptly resets the entire block.

I am attaching a link to the site and both codes.

project2319498.tilda.ws

To change the side menu:

.posAnsld{
    position : absolute;
    width:100%;
    top:0;
}
.outAnth{
    opacity:0;
    z-index:-1;
}
.piecezeroslides{transition:all 1.0s ease-in-out}
.allzeroslides{ position: relative}
.paginbtn  {
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
  }

$( document ).ready(function() {
//ID Zero
var sbZero = [
    '#rec180549015',
    '#rec180552771',
    '#rec180553108',
    '#rec180553207',
    '#rec180553303',
    '#rec180553892',
    '#rec180554107',
    '#rec180554471',
];
//Добавляем классы к блокам    
 $.each(sbZero, function(index,value) {
  $(sbZero[index]).addClass('piecezeroslides');
  });
$('.piecezeroslides:not(:first)').addClass('outAnth posAnsld');  
//Добавляем общие классы
$('.piecezeroslides').wrapAll('<div class="allzeroslides"></div>');
//Присваиваем класс нашим кнопкам
$('a[href^="#slide"]').addClass("paginbtn");
//При клике на кнопку
$('.paginbtn').click(function(e) {e.preventDefault();
  var btnNum = Number.parseInt( $(this).attr('href').substring(6));
  $('.piecezeroslides').addClass('outAnth');
  $(sbZero[btnNum-1]).removeClass('outAnth');
});
});


Sliders:
(function () {
  // Id блока, в котором будет слайдер 
  var block = $("#rec180549015");
  // Class элемента, в котором будет находиться слайдер
  var wrap = $(".tn-elem__1805490151587405066844");
  // Id блоков, которые будут слайдами
  var slides = $("#rec182807625, #rec182808102, #rec182837945");

  wrap.addClass("tildoshnaya-slider-owl");
  var box = wrap.find(".tn-atom");
  box.append('<div class="owl-carousel owl-theme"></div>');
  slides.appendTo(block.find('.owl-carousel'));
  var owl = wrap.find('.owl-carousel').owlCarousel({
    // Зациклить слайдер - true
    // Без зацикленности - false
      loop: true,
               // Точки-контроллы
      dots: false,
      nav:false,
      // Колличество карточек
      items: 1,

      // Адаптивность
      responsive:{
      	// 0 это минимальная ширина экрана, при которой включается следующая часть кода
          // 0:{ 
          //	items: 1 это колличество слайдов на экране
          //     items:1
          // },
          0:{
              items:1
          },
          0:{
              items:1
          },
          0:{
              items:1
          },
      }
      // Адаптивность: конец
  })


  block.find("[href='#slider_left']").click(function(e){
          e.preventDefault();
    owl.trigger('prev.owl.carousel');
  })
  block.find("[href='#slider_right']").click(function(e){
          e.preventDefault();
    owl.trigger('next.owl.carousel');
  })
}());

/* tildoshnaya_  */
  .tildoshnaya-slider-owl .t-rec .t396__artboard  {
    /* Указываем высоту слайда */
    height: 850px !important;
    /* Указываем ширину слайда */
    width: 650px !important;
  }
  .tildoshnaya-slider-owl {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: stretch;
  }
       .tildoshnaya-slider-owl .t-rec,
       .tildoshnaya-slider-owl .t396__artboard {
              overflow: hidden !important;
        }

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question