Api fullscreen con html5

Ya hace mas de 1 año youtube comenzo a usa su reproductor en html5 y algo que me dejaba con la duda era como hacia para hacer el fullscreen del video ya veo que era la API Fullscreen de javascript que nos permite colocar un elemento de nuestro documento html en toda la pantalla y esto funciona como nativo en los smartphone.

como es una tecnologia experimental pueda que tenga cambios en nuevas versiones de navegadores ahora funciona en motores Gecko  y WebKit

Standar -> requestFullScreen()

Gecko -> element.mozRequestFullScreen()

WebKit -> element.webkitRequestFullscreen().

con este script ya tenemos para hacer el fullscreen

function launchFullscreen(element) {
//comprobamos si el navegador detecta la api ya que si no lo detecta seguira con moz y webkit
if(element.requestFullScreen) {
element.requestFullScreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
}
//comprobamos si el navegador detecta la api ya que si no lo detecta seguira con moz y webkit
function cancelFullscreen() {
if(document.cancelFullScreen) {
document.cancelFullScreen();
} else if(document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if(document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}

en boton para llamar la accion seria por ejemplo asi

<button >

aqui estoy estoy colocando en fullscreen todo el contenido de elemento con la id noticias tambien agregue la funcion para cancelar el fullscreen con una funcion javascript que debe estar en algun boton dentro del elemento noticias.

El soporte de esta API a la fecha de hoy
Escritorio

Mobil