web-dev-qa-db-fra.com

largeur de balise audio html 5

Je me demandais s'il était possible de définir la largeur de la balise audio. Ce n'est pas une fonctionnalité prise en charge par défaut, donc les "hacks" seront acceptés avec plaisir.
.

Il n'y a pas besoin de prise en charge multiplateforme/navigateur; Je suis content tant que FireFox (3.6 ++) le prend en charge.

Exemple rapide de ce que j'utiliserai:

<audio preload="auto" id="id12" controls="controls" onended="func12();" src="http://192.168.1.68/mymusic.wav"></audio>
html5layouthtml5-audio
25
user704063

Réglez-le de la même manière que vous définiriez la largeur de tout autre élément HTML, avec CSS:

audio { width: 200px; }

Notez que audio est un élément en ligne par défaut dans Firefox, vous pouvez donc également le définir sur display: block. Voici un exemple .

47
robertc

Pour ceux qui recherchent un exemple en ligne, en voici un:

<audio controls style="width: 200px;">
   <source src="http://somewhere.mp3" type="audio/mpeg">
</audio>

Il ne semble pas respecter un réglage "en hauteur", du moins pas de manière impressionnante. Mais vous pouvez toujours "personnaliser" les contrôles mais en créant vos propres contrôles (au lieu d'utiliser ceux intégrés) ou en utilisant le widget de quelqu'un qui crée de manière similaire le sien :)

11
rogerdpack

Vous pouvez également définir la largeur d'une balise audio par JavaScript:

audio = document.getElementById('audio-id');
audio.style.width = '200px';
1
Calvin

Vous pouvez utiliser le HTML et être un patron avec des choses simples:

<embed src="music.mp3" width="3000" height="200" controls>

0
XMMR12