https://www.unionmart.ru/bitrix/templates/design2025/components/bi…/sections.list.carousel/script.js

1document.addEventListener('DOMContentLoaded', () => {
2
3    const sliderEl = document.getElementById('coverSwiper');
4    const firstImg = sliderEl.querySelector('.cover-card__bg img');
5
6    function loadImage(img) {
7        return new Promise(resolve => {
8            if (img.complete) return resolve();
9            img.onload = resolve;
10            img.onerror = resolve;
11        });
12    }
13
14    loadImage(firstImg).then(() => {
15
16        const swiper = new Swiper('#coverSwiper', {
17            slidesPerView: 1.2,
18            spaceBetween: 16,
19            speed: 700,
20            loop: true,
21            navigation: {
22                nextEl: '.cover-types-slider .hero-next',
23                prevEl: '.cover-types-slider .hero-prev',
24            },
25            /*pagination: {
26                el: '.cover-types-slider .hero-pagination',
27                clickable: true
28            },*/
29            pagination: false,
30            breakpoints: {
31                576:  { slidesPerView: 2.2, spaceBetween: 20 },
32                768:  { slidesPerView: 3.2, spaceBetween: 24 },
33                992:  { slidesPerView: 4.2, spaceBetween: 26 },
34                1200: { slidesPerView: 5,   spaceBetween: 28 },
35                1400: { slidesPerView: 6, spaceBetween: 30 },
36            },
37        });
38
39        // ïîñëå ïîëíîé èíèöèàëèçàöèè
40        sliderEl.classList.remove('is-loading');
41        sliderEl.classList.add('is-ready');
42
43        // óäàëÿåì placeholder — òåïåðü îí íå íóæåí
44        document.querySelector('.coverSwiper-placeholder').remove();
45    });
46
47});