Museum Music
Che
Pre-Night 3
Che
Rest In Bass
Che
function initSliders() { // Destroy existing slick before re-initializing if ($('.slider-for').hasClass('slick-initialized')) { $('.slider-for').slick('unslick'); } if ($('.slider-nav').hasClass('slick-initialized')) { $('.slider-nav').slick('unslick'); } // Step 1: Assign data-index... $('.slider-for .w-dyn-item').each(function(i){ $(this).attr('data-index', i); }); $('.slider-nav .w-dyn-item').each(function(i){ $(this).attr('data-index', i); $(this).find('.slider-nav-item-hero').attr('data-index', i); }); // Step 2: Init Slick sliders again $('.slider-for').slick({ slidesToShow: 1, slidesToScroll: 1, arrows: false, fade: true, speed: 300, asNavFor: '.slider-nav', draggable: false, swipe: false }); $('.slider-nav').slick({ slidesToShow: 4, slidesToScroll: 1, asNavFor: '.slider-for', dots: false, arrows: true, prevArrow: $('.nav-prev'), nextArrow: $('.nav-next'), infinite: true, focusOnSelect: true, centerMode: true, draggable: false, swipe: false, responsive: [ { breakpoint: 767, settings: { slidesToShow: 3 } }, { breakpoint: 450, settings: { slidesToShow: 2 } } ] }); // Step 3: Update markers function updateMarkers(index) { $('.slider-nav .slider-nav-item-hero .nav-active-bg').hide(); $('.slider-nav .slider-nav-item-hero').each(function(){ if ($(this).data('index') == index) { $(this).find('.nav-active-bg').show(); } }); } updateMarkers(0); $('.slider-for').on('beforeChange', function(event, slick, currentSlide, nextSlide) { updateMarkers(nextSlide); }); } // Run on page load $(document).ready(initSliders);