Как исправить функцию, которая мешает работе стандартного HTML5-видеоплеера Firefox по умолчанию

Почему

onclick="this.play();"

вмешательство в элементы управления видео HTML5 по умолчанию в Firefox и как это исправить?

У меня есть проблема, когда я дал своему плакату возможность воспроизведения этой функции по щелчку, и она работает в браузерах, кроме Firefox. Элемент управления видео HTML5 по умолчанию в Firefox теперь не работает. Если вы нажмете кнопку воспроизведения, он ничего не сделает, кроме обновления области, и кнопка воспроизведения снова появится, но видео никогда не воспроизводится. Но если вы пропустите видео к определенным частям, оно «в конце концов» загрузится и воспроизведет его.

Вот код:

<video id="bigvid3" poster="https://cdn.shopify.com/s/files/1/0641/4457/files/Very_Clean.jpg?
5718060450832183858" onclick="this.play();" preload="none" controls="controls" width="100%">
<source src="//cdn.shopify.com/s/files/1/0641/4457/t/3/assets/InnovoThermometer.mp4"    type="video/mp4">
</video>


javascript html jquery firefox video
person Jeffrey James    schedule 30.08.2016    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Вы должны отключить элементы управления firefox по умолчанию.

document.getElementById('myVideo').addEventListener('click', function (event) {
    event.preventDefault(); // Prevent the default behaviour in FireFox

    // Then toggle the video ourselves
    if (this.paused) {
        this.play();
    }
    else {
        this.pause();
    }
});

Замените myVideo идентификатором вашего видео, в данном случае «bigvid3». Вы получите тот функционал, который ищете.

Если вы хотите узнать больше, перейдите по этой ссылке так как он тоже отвечает на этот вопрос.

person Fred Joseph    schedule 30.08.2016
comment
Благодарим Вас за оценку С его кодом я смог найти ответ на этот вопрос. Удачи - person Fred Joseph; 30.08.2016
comment
Верно. Спасибо вам обоим! Я проверяю ссылку. Там много хорошей информации - person Jeffrey James; 30.08.2016

arrow_upward
2
arrow_downward

Только что попробовал запустить ваш фрагмент в Firefox, он действительно не работает должным образом. Если это проблема только в firefox, то я могу предложить обходной путь.

onclick="if(!$.browser.mozilla){this.play();}"

Что делает этот код, так это проверяет, является ли браузер Firefox, если да, ничего не делать. это позволит вам полагаться на обработку кликов по умолчанию.

см. пример на codepen

person Ji_in_coding    schedule 30.08.2016
comment
Интересный. Но похоже, что при нажатии на плакат теперь не будет воспроизводиться видео, как раньше, с измененным обходным путем. Как на codepen, так и на сайте, где находится видео, ни один из них не воспроизводится, когда я нажимаю на постер с этой разметкой. - person Jeffrey James; 30.08.2016
comment
@JeffreyJames Я только что протестировал Firefox 43 и Chrome. оба играют нормально. у вас старый браузер? - person Ji_in_coding; 30.08.2016
comment
Это странно. У меня последняя версия хрома. Фаерфокс играет нормально. IE не использует обходной путь. Но на хроме не играет. Пожалуйста, знайте, что я имею в виду щелчок по изображению, чтобы воспроизвести видео, а не нажатие фактической кнопки воспроизведения по умолчанию внизу. Извините, если может возникнуть путаница. - person Jeffrey James; 30.08.2016
comment
@JeffreyJames О ... Я на самом деле нажимаю кнопку воспроизведения. Но я только что попробовал ваш исходный код на всех хромах, то есть в Firefox. Это действительно работает, когда я нажимаю на изображение сообщения. Мой фаерфокс версии 43 - person Ji_in_coding; 30.08.2016
comment
Вероятно, это потому, что вы попробовали это, пока я возвращал старую функцию onclick в исходное состояние. Сейчас пробую новую функцию от другого помощника. - person Jeffrey James; 30.08.2016