article(s) dans votre panier VOIR

Un arrière-plan en video full-screen avec HTML5 et CSS3

  • Vidéo 15 sur 32
  • 4h15 de formation
  • 32 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
Un arrière-plan en video full-screen
00:00 / 10:51
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
49,90€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Sommaire de la formation

Détails de la formation

Voyons à présent la gestion d'une vidéo full screen. Le formateur nous montre le script actuel et on se rend alors compte que même si la vidéo actuelle peut paraitre full screen, elle ne l'est pas du tout en réalité. En effet, lorsque l'auteur agrandit ou réduit la taille de la fenêtre, la taille de la vidéo ne se modifie pas, elle reste tout simplement à sa taille initiale. Au niveau de la préparation du HTML, on retrouve la balise de la vidéo en question nommée « video_background », ainsi que « l'autoplay », ce qui nous permet d'éviter d'avoir des petits boutons de commandes pour pouvoir lancer la vidéo. « loop=loop » signifie qu'une fois arrivé au bout, la vidéo se relancera. Pour vouloir modifier la taille de votre vidéo dans votre document HTML, il vous faudra tout d'abord connaître la taille de celle-ci. Le formateur crée ensuite une fonction « ajusteTaille() », qui permettra d'immédiatement redéfinir la taille d'une vidéo en fonction de l'écran sur lequel elle est lu. Découvrez l'ensemble des manipulations à effectuer sur le fichier HTML pour pouvoir modifier la taille d'une vidéo sur le web.