Balisage vidéo HTML5 maître - les mannequins

En deux mots, il y a deux éléments principaux pour HTML5, les deux sont absurdement faciles à utiliser. L'élément vidéo est nommé et l'élément audio est nommé.

Contrairement à l'audio, qui ne nécessite pas beaucoup (ou pas) d'espace sur l'écran, la vidéo nécessite un cadre à l'écran, ainsi que des contrôles plus sophistiqués et plus nombreux. C'est pourquoi, bien que les deux éléments de balisage soient similaires, la vidéo s'accompagne de beaucoup plus de bagages, même si la structure de base de l'élément reste la même:

 controls >> Alternatives Ici, l'attribut src pointe vers le fichier vidéo que vous aimeriez lire. Il spécifie le nom du fichier d'objet vidéo pour la lecture et doit être un URI valide. Exemple: src = "video. ogg ".

La liste des attributs de contrôle pour la vidéo est considérablement plus longue et un peu plus compliquée, elle aussi:

lecture automatique: Indique au navigateur de démarrer la lecture de la vidéo dès que le fichier objet est chargé. Exemples: autoplay ou autoplay = "autoplay".

• contrôles: Indique au navigateur d'afficher un widget à l'écran pour contrôler la lecture vidéo (généralement avec les boutons Pause / Lecture, une barre de progression et les commandes de volume). Exemples: controls ou controls = "controls".

• height: Définit la hauteur, en pixels, de la boîte à l'intérieur de laquelle la vidéo sera affichée. Exemple: height = "480".

• loop: indique au navigateur de revenir au début et de continuer à jouer quand il arrive à la fin du fichier objet Exemples: loop ou loop = "loop".

• < ! --3 ->

  mediagroup: Utilisé pour synchroniser la lecture de plusieurs vidéos ou éléments multimédias (comme une piste en langue des signes ou une piste SAP) Prend une valeur de chaîne, où tous les articles avec la même valeur mediagroup sont traités Exemple: mediagroup = "film".

• muet: définit l'état de la sortie audio pour la lecture, s'il est présent, l'audio est coupé lorsque la lecture commence. qu'ils peuvent choisir d'activer l'audio s'ils le souhaitent Exemples: muted ou muted = "muted".

• poster: Spécifie une image à afficher alors que le fichier vidéo n'est pas disponible (n'a pas encore été chargé). = "Poster. Jpg".

• preload: Indique au navigateur s'il doit précharger le fichier objet, et si oui comment il doit être préchargé. Les valeurs incluent:

• none: Ne charge aucune partie du fichier vidéo lors du chargement de la page.

  • métadonnées: Charge uniquement les métadonnées vidéo lors du chargement de la page. Il configure également la lecture mais n'a pas encore de données chargées.

  • auto: Charge l'intégralité du fichier vidéo lors du chargement de la page.

  • L'attribut preload est ignoré si autoplay est présent.

  width: Définit la largeur, en pixels, de la zone à l'intérieur de laquelle la vidéo s'affiche. Exemple: width = "640".

• Le balisage suivant affiche un extrait vidéo de Wikipédia:

Le navigateur ne prend pas en charge la vidéo HTML5; une lecture alternative est fournie

La figure montre ce que cette page contient dans un fichier HTML correctement construit "La barre de contrôle de la vidéo est presque identique à la barre de contrôle de l'audio.

La différence est que la barre de contrôle vidéo est encadrée. Veuillez noter également que les alternatives pour la lecture vidéo fonctionnent de la même manière que pour le feedback audio, ainsi vous pouvez empiler votre lecteur préféré en premier pour les navigateurs HTML5, si possible, suivi des autres joueurs dans l'ordre que vous préférez