Page 1 sur 1

Fond sonore à l'ouverture

Posté : 31 oct. 2021, 09:58
par ChrisCMoi62
Bonjour,
Je souhaite ajouter un son qui doit démarrer à l'ouverture de ma page d'accueil de mon site, et en même temps que le lecteur ne soit pas visible, mais pas moyen d'y parvenir, quelqu'un a une solution ?

Code : Tout sélectionner

<audio id="myAudio" preload="metadata" controls="true" autoplay="true"> <source src="son.ogg" type="audio/ogg"> <source src="son.mp3" type="audio/mpeg"> <source src="son.wav" type="audio/wav"> Votre navigateur n'autorise pas les éléments audio. </audio> <p id="demo"></p> <script> function myFunction() { var x = document.getElementById("myAudio").autoplay; document.getElementById("demo").innerHTML = x; } </script>

Re: Fond sonore à l'ouverture

Posté : 01 nov. 2021, 18:58
par @rthur
Les navigateurs bloquent en général ce genre de procédé, car ils constituent une gêne pour les utilisateurs.
Si ton visiteur est au bureau avec le son allumé, ou qu'il ouvre plusieurs onglets avec différents sites, s’il y en a un qui émet du son c'est galère...

Bref, es-tu sûr que tu veux faire ça sans aucune action d'un utilisateur ?
Si oui, il va bidouiller pas mal pour trouver un contournement et des tests dans chaque navigateur pour vérifier que ça fonctionne partout comme prévu.

Re: Fond sonore à l'ouverture

Posté : 01 nov. 2021, 21:04
par ChrisCMoi62
Bonjour,
En fait c'est un son bref et léger que je souhaite insérer, mais je be vois pas comment contourner le blocage.
Cordialement

Re: Fond sonore à l'ouverture

Posté : 01 nov. 2021, 21:52
par @rthur
Effectivement, les quelques solutions qui existaient il y a quelques années ont été bloquées à priori, donc c'est mort.
https://developer.chrome.com/blog/autoplay/
https://developer.mozilla.org/en-US/doc ... play_guide

Re: Fond sonore à l'ouverture

Posté : 02 avr. 2022, 22:01
par nestor94
</style>
</head>
<body>
<audio src="sons/connexion.mp3" autoplay>
</audio>
sur ma page accueil et sous Firefox, ça fonctionne.

Re: Fond sonore à l'ouverture

Posté : 26 avr. 2022, 13:26
par two3d
Une fois trouvé, pour cacher le lecteur un simple style="display:none" sera à mon avis fonctionnel.

Ou si ça ne fonctionne pas, un visibility:hidden