et onloadedmetadata-event

J’aimerais utiliser les dimensions d’un élément vidéo HTML5 en JavaScript. La balise video elle-même n’a pas de dimensions définies, je pense donc qu’elle s’adaptera à la taille de la vidéo (ce qui est le cas). Mon balisage ressemble à ceci:

Lorsque j’utilise simplement jQuery pour obtenir la height() l’élément height() et / ou la width() , j’obtiens une valeur par défaut de 300 car il n’attendra pas le chargement de la vidéo. Donc ce que j’ai découvert sur le Web ( ici et ici ), c’est que je devrais attendre le onloadedmetadata onloadedmetadata. J’essaie donc de faire ce qui suit dans mon JS:

 var video = document.getElementById('viddy'); video.onloadedmetadata = function(e){ var dimensions = [video.videoWidth, video.videoHeight]; alert(dimensions); } 

Pourtant, l’événement ne sera jamais déclenché (bien que la vidéo soit chargée et jouée) et je ne pourrai jamais obtenir mes dimensions. La même chose se produit avec un jQuery- bind('load', et de toute autre manière que je pourrais penser. Une idée? Merci.

• Désactiver la lecture / pause / plein écran pour HTML5 en cliquant sur YouTube
• jQuery, pourquoi le rewind playbackRate ne fonctionne pas?
• Rendre la vidéo HTML5 déplaçable sans perdre les contrôles
• Arrêtez la vidéo HTML5 à l’heure indiquée
• iPad html5 vidéo sans contrôles?

• HTML5 générer une vidéo à partir d’images
• Générer une miniature / capture instantanée d’un fichier vidéo sélectionné par une entrée de fichier à une heure spécifique
• balise vidéo html5 pour jouer en plein écran avec Android
• Événements déclencheurs du lecteur vidéo html5 avec JQuery
• terminé videojs événement ne fonctionne pas

  ...   

 video.addEventListener('loadedmetadata', function(e){ 

 $(document).ready(function() { $('#viddy').on('loadedmetadata', function() { var dimensions = [this.videoWidth, this.videoHeight]; alert(dimensions); }); });