@Michael_Catlink

Почему фотографии карточек товаров на Tilda прогружаются только после изменении размера окна?

Встроил в страницу сайта скрипт - конструктор товара (по комбинации нажатых кнопок показывает нужную карточку товара), но изображение прогружается только у первой карточки на странице, у остальных при переключении видны только миниатюры. Прогружается картинка если нажать на миниатюру или если изменить размеры окна
<style>
  /*Время и вид анимации для вкладок*/
    .baseCl{
        transition:all 0.4s ease-in-out;
    }
  /*Стиль веделенной вкладки*/  
    .baseClactive{
      box-shadow: 10px 5px 5px #000, 0 0 0px 1px #000;
    } 
  /*Стиль при наведении на вкладку*/  
     .brandname:hover{
        color:#000000 !important;
    }
  </style> 
   
  <script>
     $( document ).ready(function() {
     //ПРисваиваем класс вкладкам   
     $('[href="#shape"]').addClass('baseCl shape');
     $('[href="#material"]').addClass('baseCl material');
     //Делаем выделенные первые вкладки  
     $('.shape').first().addClass('baseClactive');
     $('.material').first().addClass('baseClactive');
     var shapeN=0, materialN=0;
      
     //Создаём список блоков
     var blkMass = { '00': '#rec453845111',
                     '01': '#rec453845114',
                     '02': '#rec453845130',
                      
                     '10': '#rec453845145',
                     '11': '#rec453845150',
                     '12': '#rec453845163',
                      
                     '20': '#rec453845167',
                     '21': '#rec453845169',
                     '22': '#rec453845170'
                      
                   };
                    
     //Добавляем классы ко всем блокам продуктов
     $.each(blkMass, function( key, value ) {$(blkMass[key]).addClass('blkProduct');});
     $('.blkProduct').not('.blkProduct:eq(0)').hide();
     function findProduct(){
       var actionBlk = String(shapeN)+String(materialN);$('.blkProduct').hide();
       $(blkMass[actionBlk]).show();$('.t744').trigger('displayChanged');   };
      
     //При клике на модель
      $('.shape').click(function(e) {e.preventDefault();
      $('.shape').removeClass('baseClactive');$(this).addClass('baseClactive'); 
      shapeN = $(".shape").index(this);findProduct();    });
      //При клике на ротанг
      $('.material').click(function(e) {e.preventDefault();
      $('.material').removeClass('baseClactive');$(this).addClass('baseClactive');  
      materialN = $(".material").index(this);findProduct();    });
      })
  </script>
  • Вопрос задан
  • 568 просмотров
Пригласить эксперта
Ответы на вопрос 1
tildamaster
@tildamaster
Все для Tilda → www.ilda.top
Можете попробовать добавить
t_lazyload_update();
в конце всех строк, внутри $('.shape').click(function(e) {}) и $('.material').click(function(e) {})
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы