Сейчас узнаем, какой подарок выпадет именно Вам
Крутите колесо
Ура, вы выиграли!
Ваш приз:
Годовой доступ
к видео на mo-ti -20%
по промокоду T19RAY
Промокод действителен 3 дня

Оформить доступ с промокодом
100
#2470a1
Как при при смене вкладки TX16N2 отобразить нужную галерею в ZeroBlock в Tilda
ГОРНЫЙ ПАРК РУСКЕАЛА
уникальная достопримечательность Карелии
Музыкальный концерт необычного формата вновь пройдет в окружении отвесных берегов Мраморного каньона Горного парка «Рускеала».

Как при при смене вкладки TX16N2 отобразить нужную галерею в ZeroBlock в Tilda

1
Создали ZeroBlock и добавили в него 4 Gallery с классами
acc_zeroslider1 , acc_zeroslider2 ...
2
Задали высоту блоку 0рх и включили overflow - visible.
Разместили галереи справа
3
Создали блок TX16N2 на 4 вкладки
Настройки:
+ 4 колонки
+ Текст первой карточки раскрыт сразу
+ Аккордеон. Отображать только одну раскрытую карточку

4
Добавили код в блок Другое - Т123
Библиотека для примера

<style>
.t668__col {
    float: none;
    display: block;
}
div[class*="acc_zeroslider"]{
    transition:opacity 0.3s ease-in-out;
}
.dis_gallery{
        pointer-events:none;
        opacity:0;
}
@media screen and (min-width:1000px){
img.t668__img {
    width: 0;
}
}
</style>
<script>
$( document ).ready(function() {
$('div[class*="acc_zeroslider"]:not(:first)').addClass("dis_gallery");
function hideSlider(em){
    $('div[class*="acc_zeroslider"]').addClass("dis_gallery");
    $('.acc_zeroslider'+em).removeClass("dis_gallery");
};
$('.t668__accordion').click(function() {
    let accordWrap = $(this).closest('.t-container');
    let accordNum = 1+accordWrap.find('.t668__accordion').index( $(this) );
    let accElem = $(this);
    setTimeout(function(){
        if ( accElem.find('.t668__header').hasClass('t668__opened')  ){
            hideSlider(accordNum);     
        }else{
            $('div[class*="acc_zeroslider"]').addClass("dis_gallery");
    };  
    }, 300);
});
});    
</script>
Made on
Tilda