5546 sujets
Sémantique web et HTML
js_html a écrit :
Bonjour,
Comment met-on du son sur une page web sans que la barre son s'affiche et que l’utilisateur ait à cliquer dessus ?
Merci beaucoup !
upload/1603363582-81417-barreson.png
Suffit de chercher un peu.... rtfm<audio>
Modifié par niuxe (22 Oct 2020 - 13:52)
Bonjour,
C'est une mauvaise pratique, et dans le cas général, les navigateurs font tout pour l'interdire. Donc la réponse est : on ne peut pas.
Il faut soit laisser la barre des "controls", soit ajouter un bouton (ou tout autre élément capable de détecter une action de l'utilisateur) qui permettra à l'utilisateur de lancer le son.
Par exemple:
Html
Javascript en fin de page :
Dans certains cas, on pourra espérer lancer le son automatiquement (c'est compliqué). On pourra pour plus d'information lire :
https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
Amicalement,
Modifié par parsimonhi (22 Oct 2020 - 14:08)
C'est une mauvaise pratique, et dans le cas général, les navigateurs font tout pour l'interdire. Donc la réponse est : on ne peut pas.
Il faut soit laisser la barre des "controls", soit ajouter un bouton (ou tout autre élément capable de détecter une action de l'utilisateur) qui permettra à l'utilisateur de lancer le son.
Par exemple:
Html
<audio id="CaSaoule">
<source src="CaSaoule.mp3" type="audio/mp3" />
</audio>
<button>Go</button>
Javascript en fin de page :
var magic = function(){document.querySelector('#CaSaoule').play();};
document.querySelector('button').addEventListener("click",magic);
Dans certains cas, on pourra espérer lancer le son automatiquement (c'est compliqué). On pourra pour plus d'information lire :
https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
Amicalement,
Modifié par parsimonhi (22 Oct 2020 - 14:08)
Bonjour,
Pour l'arrêter il faut faire un autre bouton en remplaçant par exemple play() par pause().
Par exemple :
Amicalement,
Pour l'arrêter il faut faire un autre bouton en remplaçant par exemple play() par pause().
Par exemple :
<audio id="CaSaoule">
<source src="CaSaoule.mp3" type="audio/mp3" />
</audio>
<button id="start">Start</button>
<button id="stop">Stop</button>
var magicStart = function(){document.querySelector('#CaSaoule').play();};
var magicStop = function(){document.querySelector('#CaSaoule').pause();};
document.querySelector('#start').addEventListener("click",magicStart);
document.querySelector('#stop').addEventListener("click",magicStop);
Amicalement,