Как остановить HTML5 видео при закрытии встроенного всплывающего окна, кросс-браузер

0

Привет, коллеги-кодеры, я прихожу к вам в нужное время. У меня есть встроенное всплывающее окно, содержащее видео html5. Я добавил остановку ('# video'); к функции "закрыть всплывающее окно", и это работает, но только в Chrome и Opera, а не в Firefox и EI, что приводит меня к второму вопросу, основанному на том же коде, может ли кто-нибудь объяснить, почему видео не загружается должным образом в Опера и сафари. Я не могу, чтобы жизнь меня определяла, почему и я надеюсь, что один из вас сможет.

HTML:

<section id="video">
    <a href="#" class="topopup">
        <img src="images/play.png" alt="Play company video" title="Play company Video"/>
    </a>

    <div id="toPopup">
        <div class="close"></div>
        <div id="popup_content">
            <video width="100%" height="auto" controls>
                <source src="video/AM1.mp4" type="video/mp4">
                <source src="video/AM2.webm" type="video/webm">
                <source src="video/AM3.ogg" type="video/ogg">
                Video format not supported by your browser
            </video>
        </div>
    </div>
    </div>
    <div id="backgroundPopup"></div>
</section>

CSS:

#video {
    background: #ecf0f1;
    /*light gray*/
}

#video img {
    width: 36.11%;
    max-width: 252px;
}

#backgroundPopup {
    position: fixed;
    display:none;
    height:100%;
    width:100%;
    background:#000000;
    top:0px;
    left:0px;
}

#toPopup {
    background: none repeat scroll #000;
    margin-left:10%;
    margin-right:10%;
    height:auto;
    display: none;
    position: fixed;
    top: 10%;
    z-index: 1;
}

JavaScript:

$(this).keyup(function (event) {
    if (event.which == 27) // 27 is 'Ecs' in the keyboard
    disablePopup(); // function close pop up
});

$(this).keyup(function (event) {
    if (event.which == 27) stop('#video');

});

$("div#backgroundPopup").click(function () {
    disablePopup(); //  close pop up

});

$("div#backgroundPopup").click(function () {
    stop('#video'); // stop video
});
Теги:

2 ответа

1
Лучший ответ

Я немного озадачен тем, как ваша функция stop работает где угодно - способ остановить видео HTML5 - это использовать DOMNode.pause(). Может, я неправильно понял ваш пост?

  • 0
    Нет, из вашего ответа это звучит так, как будто вы поняли, я прочитал несколько мест, которые останавливаются ('# video'); это не настоящая функция, но я думаю, некоторые браузеры исправят это. Но в любом случае я опробую DOMNode.pause (), а затем я вернусь к вам
  • 0
    Извините, но я новичок, и я не могу получить DOMNode.pause ('# video'); для работы в любом браузере, не могли бы вы привести пример того, как правильно построить функцию DOMNode.pause?
Показать ещё 2 комментария
0

Добавить идентификатор в тег видео

чем вы можете получить доступ к объекту DOM видео с помощью Javascript

var videoControl = document.getElementById("myVideoPlayer"); videoControl.pause();

Ещё вопросы

Сообщество Overcoder
Наверх
Меню