Элемент видео пропадает в Chrome, когда не используется управление

Question

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

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

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

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

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

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

Спасибо!

Wayne

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

Answer 1

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

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

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

Проверьте это: 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'); 
} 

Answer 2

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

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

Answer 3

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

<video class="animation" preload controls> 

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

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

Это решает проблему, пока мы ждем на fix for the regression.