Элемент видео исчезает в Chrome, если не используются элементы управления - PullRequest
Новая
       22

Элемент видео исчезает в Chrome, если не используются элементы управления

7 голосов
/ 05 марта 2012

Итак - я думаю это ошибка браузера. Он появился в гораздо более сложном дизайне / сайте, но я хорошо разбирался в нем, упростил свой код и дизайн и т. Д. И нашел следующее:

При встраивании <video> без атрибута элементов управления в Chrome запуск видео для воспроизведения с использованием javascript приводит к тому, что элемент видео становится пустым.

http://jsfiddle.net/trolleymusic/2fHTv/

Пустота немного случайна, иногда, когда выкатываете элемент, он появляется снова. Иногда вам нужно нажать / сфокусироваться на чем-то другом, в большинстве случаев приостановка видео приводит к его повторному появлению.

Я также поместил туда (закомментированную) строку, чтобы показать, что она основана не только на щелчке, она происходит, когда play() вызывается также через setTimeout.

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

Спасибо!

Wayne

(Ооо - и другое видео показывает, что другой элемент, который идентичен атрибуту controls, работает нормально

Ответы [ 3 ]

11 голосов
/ 06 марта 2012

Ну, я тоже могу ответить на свой вопрос, если кому-то понадобится в будущем.

Это IS ошибка, она отлично работает в Chrome 19.

Мой обходной путь в этом случае состоял в том, чтобы проверить, был ли атрибут управления, если не добавить его, воспроизвести видео, а затем удалить атрибут управления.

Проверьте это: http://jsfiddle.net/trolleymusic/vhgss/

playVideo = function(el) {
    if (!el) { return; }
    if (el.getAttribute('controls') !== 'true') {
        el.setAttribute('controls', 'true');                    
    }
    el.paused ? el.play() : el.pause();
    el.removeAttribute('controls');
}
1 голос
/ 26 октября 2013

Я сообщил об этой ошибке проекту Chromium. Тем временем, в качестве обходного пути (все еще присутствующего в Chrome 30), я добавил элементы управления ко всем элементам видео на странице, но применил класс с именем animation к тем элементам, которые будут косвенно вызваны событиями на странице (например, глубиной прокрутки). ), а не непосредственно пользователем. 

<video class="animation" preload controls>

Затем я удалил элементы управления из .animations, используя jQuery: 

$( document ).ready(function() {
  $('video.animation').removeAttr('controls');
});

Это решает проблему, пока мы ожидаем исправления для регрессии .

1 голос
/ 22 мая 2013

Это похоже на ошибку.Я обошел это, вручную отметив метод воспроизведения в $ (document) .ready для всех моих видео вместо добавления тега autoplay: 

('#videoId').get(0).play()
...