Как вместо блока открыть страницу по ссылке? Тильда

Question

Сейчас код работает таким образом, что при нажатии на "модель девайсов" меняются блоки (пример можно посмотреть по ссылке ниже). Как сделать так, что бы открывалась страница по ссылке?

Проблема заключается в том, что это должно работать на Тильде

Сайт, где можно посмотреть как работает этот код

<!--ЗАДАЁМ ID НАШИХ БЛОКОВ -->
<script>
    $( document ).ready(function() {
//ВВОДИМ ID БЛОКОВ ДАННЫХ
//Записываем ID блоков с выбором моделей девайсов iPhone iPad MacBook Samsung Xiaomi Meizu Huawei Honor      
    var modelid = ["#rec85895701" , "#rec85905437", "#rec86135991", "#rec86169869", "#rec86219888", "#rec86238176", "#rec86256660", "#rec86259281"];
    //Создаём массив состояний для контента       
    var modelactive = [];    

//Записываем ID блоков c контентом
     var modelcontent = [
   //Для IPHONE         
    ['#rec86067695','#rec86067942','#rec86077296','#rec86077724','#rec86077899','#rec86078125','#rec86078194','#rec86078373','#rec86078990','#rec86079179','#rec86079247','#rec86079336','#rec86079375','#rec86079443','#rec86079521' ],
   //Для IPAD
    ['#rec86069935','#rec86069974','#rec86122429','#rec86122536','#rec86122546','#rec86125424','#rec86125490','#rec86125595','#rec86125683','#rec86125805','#rec86125927','#rec86126027'],
   //MACBOOK
   ['#rec86154560','#rec86154899','#rec86155152','#rec86155262','#rec86155344','#rec86156582','#rec86156911','#rec86157677','#rec86157851','#rec86158391','#rec86159208','#rec86159542','#rec86159783'],
   //SAMSUNG
   ['#rec86171503','#rec86171697','#rec86171850','#rec86171989','#rec86172221','#rec86172313','#rec86172492','#rec86172759','#rec86172906','#rec86173061','#rec86173137'],
   //XIAOMI
   ['#rec86230124','#rec86230471','#rec86230557','#rec86230655','#rec86230850','#rec86231198','#rec86231328','#rec86231578','#rec86231669','#rec86231750','#rec86231954','#rec86232222','#rec86232389','#rec86232488','#rec86232644','#rec86232763','#rec86232903','#rec86233047','#rec86233234','#rec86235061','#rec86235318'],
   //MEIZU  
   ['#rec86255454' , '#rec86255566','#rec86255705','#rec86255866','#rec86255946','#rec86256045'],
   //HUAWEI
   ['#rec86257299','#rec86257398','#rec86257459','#rec86257604','#rec86257658','#rec86257726','#rec86257899','#rec86258023','#rec86258177','#rec86258260','#rec86258299','#rec86258352'],
   //HONOR
   ['#rec86259947','#rec86260004','#rec86260185','#rec86260313','#rec86260380','#rec86260470','#rec86260561','#rec86260679','#rec86260730','#rec86260789','#rec86260834','#rec86260879']

];

//ПРОИЗВОДИМ РАЗМЕТКУ БЛОКОВ
//ДЕВАЙСЫ
//Добавляем классы ко всем блокам с моделями девайсов
   for(let i = 0; i < modelid.length; i++){
     $(modelid[i]).addClass('modelblock');
     //Заполняем массив стартовых состояний для контента
     modelactive[i]=0;    
     //Добавляем стиль выделения первой вкладки у каждого блока с девайсами
     $(modelid[i]+' a:eq(0)').addClass('modelactive');};  
//Скрываем все блоки с моделями девайсов , кроме первого   
   $('.modelblock').not('.modelblock:eq(0)').hide();
   $('.modelblock:eq(0)').addClass('modelshowblock');

//НАСТРОЙКА БЛОКОВ С КОНТЕНТОМ О ДЕВАЙСАХ
$.each(modelcontent,function(key,data) {
  $.each(data, function(index,value) {
  $(modelcontent[key][index]).addClass('devcontentblock');
  }); });
//Скрываем все блоки с контентом о девайсах , кроме первого   
   $('.devcontentblock').not('.devcontentblock:eq(0)').hide();  

//УПРАВЛЕНИЕ ВКЛАДКАМИ БРЭНДОВ    
    //ПРисваиваем всем текстовым объектам с этой ссылкой этот класс   
   $('[href="#brandname"]').addClass('brandname');
//Делаем выделенную первую вкладку   
   $('.brandname:eq(0)').addClass('brandnameactive');
   //Объявляем порядковую переменную  
   var numberbrand = 0;  
   //При клике на брэнд
 $('.brandname').click(function(event) {
   //Выясняем порядковый номер вкладки
       numberbrand = $(".brandname").index(this);
      
  //Скрываем блоки с моделями девайсов
     $('.modelblock').removeClass('modelshowblock').hide();
     $('.modelblock:eq('+numberbrand+')').addClass('modelshowblock').show();
  //Убираем стиль выделения с активной вкладки      
       $('.brandname').removeClass('brandnameactive');
  //Активируем ту вкладку , на которую кликнули
       $('.brandname:eq('+numberbrand+')').addClass('brandnameactive');
   //Скрываем блоки с контентом о девайсах и показываем нужный
   $('.devcontentblock').hide();
   $(modelcontent[numberbrand][modelactive[numberbrand]]).show();
   
   //Инициализация слайдеров 
   var recid = modelcontent[numberbrand][modelactive[numberbrand]] ; 
   recid = recid.substr(4);
   t_slds_updateSlider(''+recid+'');
   t_slds_positionArrows(''+recid+'');
   
event.preventDefault();     
 });

//УПРАВЛЕНИЕ ВКЛАДКАМИ ДЕВАЙСОВ    
//Объявляем порядковую переменную  для кнопок в блоках с девайсами
      var numbermodel = 0;
      var numbeactiveblock = 0;
   //При клике на кнопку девайса
 $('.modelblock a').click(function(event) {
   //Вычисляем ID блока, в котором был клик
      var clickId = '#'+$(this).parent('.t396__elem').parent('.t396__artboard').parent('.t396').parent('.modelblock').attr('id');
    //  console.log(clickId);
  //Выясняем порядковый номер вкладки
      numbermodel = $(clickId+' a').index(this);
  //Убираем стиль выделения с активной вкладки      
       $(clickId+' a').removeClass('modelactive');
  //Активируем ту вкладку , на которую кликнули
       $(clickId+' a:eq('+numbermodel+')').addClass('modelactive');
  
  //Скрываем блоки с контентом о девайсах и показываем нужный
   $('.devcontentblock').hide();
   $(modelcontent[numberbrand][numbermodel]).show();
  //Запоминаем выбрвнную вкладку девайса для акивного бренда 
   modelactive[numberbrand] = numbermodel;
   
    //Инициализация слайдеров 
   var recid = modelcontent[numberbrand][numbermodel] ; 
   recid = recid.substr(4);
   t_slds_updateSlider(''+recid+'');
   t_slds_positionArrows(''+recid+'');
   
   event.preventDefault();  
});
});          
</script>

<!-- ВИЗУАЛЬНЫЕ НАСТРОЙКИ БЛОКА БРЭНДОВ И НАСТРОЙКИ БЛОКА МОДЕЛЕЙ -->
<style>
/*Время и вид анимации для вкладок*/
  .brandname{
      transition:all 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  }
/*Стиль веделенной вкладки - брэнды*/  
  .brandnameactive{
      text-decoration:underline  !important;
      font-weight:600  !important;
  } 
/*Цвет текста при наведении на брэнды*/  
   .brandname:hover{
      color:#000000 !important;
  }
/*Время и вид анимации для вкладок Моделей*/
  .modelblock a{
      transition:all 0.6s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  }
/*Стиль веделенной вкладки - Модели*/  
  .modelactive{
      border-color: #3e618c !important;
      font-weight:600  !important;
  } 
/*Стили при наведении на модели*/  
   .modelblock a:hover{
      border-color: #3e618c !important;
      font-weight:600  !important;
  }
</style>

БЛОГ НА HUSL

Как вместо блока открыть страницу по ссылке? Тильда

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