Bonjour. visiteurs jour : 45       Au président     Beauté santé     Infos loisirs     Ensemble      Jean      Informatique     Einstein     Santé corona



Informatique

 Accueil  ex_cel  informatique  infos  internet  forum1  javascript  logiciels_g  cours  sites  video  somr



HTML5 video

Le plus simple

<video src="http://c-net.fr/video/video_xyz.mp4" controls="" width="704" height="396" poster="vignette.jpg" >
text facultatif, S'affiche si le navigateur est ancien : Cette vidéo ne peut être affichée sur votre navigateur Internet.
Une version est disponible en téléchargement sous xxx/adresse du lien .
</video>

poster="vignette.jpg" est facultatif

Adaptation à la largeur de la page :

<video src="http://aupresident.c-net.fr/video/video_xyz.mp4" controls="" style="width:96%;"></video>
Les vidéo YouTube posent des problèmes, la hauteur ne se synchronise pas avec la largeur.

controls :	l’attribut controls active la barre de menu native du navigateur. 
Des éléments de cette barre de menu peuvent être définis alternativement avec JavaScript.
poster	: définit un fichier image servant de vignette d’aperçu. Si n’est pas présent, 
le premier plan de la vidéo est utilisé.
autoplay indique au navigateur Web de lancer la vidéo automatiquement lors du chargement de la page.
loop	 la vidéo se lance en boucle.
muted	 coupe le son de la vidéo.
preload	 la vidéo doit être chargée dès l’ouverture de sa page Web, sans lancer la vidéo. 
preload  auto charge l’ensemble du fichier normalement,
preload metadata charge uniquement les métadonnées en avance 
preload none empêche le chargement automatique de fichiers vidéo.


Pour les navigateurs ne lisant pas mp4 (périmé) :

L'élément source à la place de l'attribut src permet de définir plusieurs sources et le logiciel de lecture choisit le format le plus approprié pour lui. Le navigateur ne télécharge que la version qu'il préfère. exemple :

<video id="video3" controls="" width="320" height="240" poster="vignette.jpg" >
    <source src="video/sintel_trailer-480p.mp4" type="video/mp4">
    <source src="video/sintel_trailer-480p.webm" type="video/webm">
    <source src="video/sintel_trailer-480p.ogg" type="video/ogg">
</video>

Total des visiteurs  :    654783   dont aujourd'hui :   45    En ligne actuellement :  1      Total des clics_1550417