UIkit Slider: проблема с встраиванием видео с YouTube в виде слайда - PullRequest
0 голосов
/ 30 мая 2020
<style>
.ytVideoWrapper{
  iframe{
    position: absolute;top:0;left:0;width: 100%;height: 100%
  }
  position: relative;
  padding-top:56.25%
}
</style>

<div class="uk-slidenav-position" data-uk-slider="{center:true}">
        <div class="uk-slider-container">
            <ul class="uk-slider uk-grid-width-medium-1-4">
                <li class="uk-width-4-5">
                   <img src="images/s1.jpg" alt="" />
                </li>

                <li class="uk-width-4-5" style="position:relative;">
                    <div class="ytVideoWrapper" style="position:absolute;left:0;top:0;width:100%;height:100%;">
                        <iframe src="https://www.youtube.com/embed/_IKWEi9bRYI?controls=0" autoplay="true" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                    </div>
                </li>
                <li class="uk-width-4-5">
                    <img src="images/s3.jpg" alt="" />
                </li>
            </ul>
        </div>
        <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-previous" data-uk-slider-item="previous"></a>
        <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-next" data-uk-slider-item="next"></a>
    </div>

Я сделал слайдер UIkit V2 вот так. Страница в реальном времени Второй слайд - это встроенное видео YouTube. Проблема в том, что как только вы начинаете воспроизведение видео, а затем переходите к другим слайдам и скользите назад, видео будет инициировано, то есть пользователь может увидеть кнопку воспроизведения YouTube и начать воспроизведение видео снова, в то время как предыдущее воспроизведение все еще продолжается. фон. Это приведет к очень плохому взаимодействию с пользователем.

Я думаю, это потому, что UIkit создает дубликат, когда слайд выскальзывает из поля зрения, а когда слайд скользит назад, он снова загружает iframe youtube, следовательно, другое видео проигрыватель запускается.

Можно ли сделать так, чтобы видео приостанавливалось только при выдвижении и возобновлялось при движении назад?

...