Видео не расширяется на весь экран в окне ExtJS

Question

Plateform: Ext JS 4.2.1

Browser: Chrome: Версия 46.0.2490.86 м Firefox 40.0.3 IE10, IE11

Требования:

Я использую HTML-тег HTML 5 внутри содержимого html окна EXTJS. Я использую пользовательские кнопки вместо атрибута управления видео.

При использовании атрибута элемента управления по умолчанию я не могу видеть значок «Развернуть полноэкранный режим» в панели управления. Я добавил свои пользовательские кнопки вместо стандартных элементов управления. Play, Pause и кнопка громкости работает отлично, как и ожидались, но весь экран не работает, даже я добавил правильный слушатель Полноэкранного, как показано ниже

// Event listener for the full-screen button 

fullScreenButton.addEventListener("click", function() { 
    if (video.requestFullscreen) { 

     video.requestFullscreen(); 

    } 
    else if (video.mozRequestFullScreen) { 
     video.mozRequestFullScreen(); // Firefox 
    } 
    else if (video.webkitRequestFullscreen) 
    { 
     console.log('fullScreenButton clicked'); 

     video.webkitRequestFullscreen(); // Chrome and Safari 

     console.log('Executed webkitRequestFullscreen()'); 
    } 
    else if (video.msRequestFullscreen) { 

     video.msRequestFullscreen(); // Internet Explorer 

    } 
}); 

Тест fiddel https://fiddle.sencha.com/#fiddle/118s

Scenario screenshot is here

Я хочу развернуть видео на полном экране, как и ожидалось, с помощью кнопки Full screen в проигрывателе. Любая помощь будет оценена.

Answer 1

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

Запроса полноэкранного режима, потому что по крайней мере один из содержащих элементов документа не является IFrame или нет атрибут "allowfullscreen".

Надеюсь, проверив это, вы можете найти решение.