jQuery(document).ready(function($) { // Existing slider initialization code...// Show slider after the page has fully loaded $(window).on('load', function() { $('.slider-for, .slider-nav').show(); });// Rest of your JavaScript code... }); jQuery(document).ready(function($) { // Main slider settings $('.slider-for').slick({ slidesToShow: 1, slidesToScroll: 1, arrows: false, // Enable arrows fade: true, asNavFor: '.slider-nav' });// Thumbnail slider settings $('.slider-nav').slick({ slidesToShow: 8, // Adjust number of thumbnails shown slidesToScroll: 8, slidesToScroll: 1, asNavFor: '.slider-for', dots: false, focusOnSelect: true, arrows: true, // Disable arrows for thumbnails vertical: false, // Set thumbnails vertical prevArrow: '', nextArrow: ''});// Video autoplay and loop $("#autoplay-video").on('ended', function() { var totalSlides = $('.slider-for').slick('getSlick').slideCount; var currentSlide = $('.slider-for').slick('slickCurrentSlide'); if (currentSlide === totalSlides - 1) { $('.slider-for').slick('slickGoTo', 0); // Loop back to first slide this.play(); // Replay video } else { $('.slider-for').slick('slickNext'); // Go to next slide } }); });