Как запустить воспроизведение только текущего (открытого) видео в слайдере Swiper?

Чтобы запустить воспроизведение только текущего видео в слайдере Swiper и остановить его при переключении слайдов, можно воспользоваться событиями Swiper и JavaScript. Ниже представлена улучшенная версия кода, которая выполняет эти задачи. 

### Пример кода

```html
<!-- Подключите Swiper CSS и JS -->
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <video controls src="video1.mp4"></video>
        </div>
        <div class="swiper-slide">
            <video controls src="video2.mp4"></video>
        </div>
        <div class="swiper-slide">
            <video controls src="video3.mp4"></video>
        </div>
    </div>
    <!-- Добавьте навигацию, если нужно -->
    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>
</div>

<script>
    const swiper = new Swiper('.swiper-container', {
        effect: 'slide', // можно использовать другие эффекты
        slidesPerView: 1,
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
        on: {
            slideChange: function () {
                // Останавливаем все видео при смене слайда
                const videos = document.querySelectorAll('video');
                videos.forEach(video => {
                    video.pause();
                    video.currentTime = 0; // Вы можете оставить это, если хотите сбросить видео при смене слайда
                });

                // Запускаем текущее видео
                const currentSlide = this.slides[this.activeIndex];
                const currentVideo = currentSlide.querySelector('video');
                if (currentVideo) {
                    currentVideo.play();
                }
            },
            // Добавьте плавное переключение
            transitionStart: function () {
                // Можно добавить эффекты или анимации
            },
            transitionEnd: function () {
                // Здесь можно выполнить действия после завершения анимации
            }
        }
    });

    // Запускаем видео на первом слайде при загрузке
    const initialVideo = document.querySelector('.swiper-slide-active video');
    if (initialVideo) {
        initialVideo.play();
    }
</script>
```

### Объяснение кода
1. **Инициализация Swiper**: Используется стандартный метод инициализации слайдера. Установлены параметры навигации и эффекта переключения.

2. **Событие `slideChange`**: Это ключевое событие, где происходит остановка всех видео при смене слайда и воспроизведение видео на текущем слайде. 
   - Сначала ищутся все теги `<video>`, и для каждого вызываются метод `pause()` и сбрасывается время воспроизведения на 0.
   - Затем, для активного слайда извлекается текущее видео и запускается воспроизведение.

3. **Плавное переключение**: Можно добавлять дополнительные действия в события `transitionStart` и `transitionEnd`, чтобы реализовать анимации или другие эффекты.

4. **Автозапуск видео**: При инициализации слайдера сразу запускается видео на первом слайде.

Таким образом, данный код обеспечивает плавное переключение слайдов, а также управление воспроизведением видео, останавливая его при смене слайда и начиная воспроизведение на новом слайде.

у меня в swiper работает так - добавьте в самом конце страницы 
 
const videos = document.querySelectorAll('video'); 
const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        const video = entry.target; 
        if (entry.isIntersecting) {
            video.play();
        } else {
            video.pause();
        }  
    });
}, {rootMargin: "-50px 0px", threshold: 0.7 }); // threshold сколько процентов должно быть видно
    videos.forEach(video => {
        observer.observe(video);
    });
 
 если видно менее 70% любого видео оно останавливается, не важно в слайдере или при прокрутке страницы. 
 Решение универсальное. 
 Можете просмотреть в живую как реализован swiper на сайте Нью-Сил