Lier un son à une image, est ce possible ?

Fermé
PapyNono - Modifié le 26 févr. 2023 à 11:25
 PapyNono - 27 févr. 2023 à 07:42

Bonjour et d'avance merci de votre aide.

Est ce possible de lier un son (mp3, wav ou midi) à une image lorsque cette image apparait à l'écran. (éventuellement par rafraichissement de la page)

Ce son son devrait être automatique (pas avec click ou passage de souris) ,instantané et une seule fois.

Le son serait "roulement de tambour.mp3" , l'mage "logo.gif"

<td align=center bgcolor="#C0C0C0" width=1300 height=810>
              <img id="image" src="JPEG/logo.gif" name="show" alt="" />
            </td>

Voilà, maintenant est-ce possible ?

D'avance merci de votre aide.


Windows / Edge 110.0.1587.56

A voir également:

1 réponse

Salut,

simplement jouer un son une fois la page cjhargée donc. Où l'image doit elle apparaître dynamiquement(et le son avec)?.

Dans les deux cas c'est la même réponse:

Utiliser une balise audio pour le son lorssque l'on veut avoir le son(voir les attributs de balise autoplay et loop réglé à inactif 'false').

https://www.w3schools.com/html/html5_audio.asp

Dans le cas ou l'image doit apparaître de façon interactive il faut utiliser un peu de javascript pour lancer la lecture du son au momnent voulu, donc ajouter simplement un .play au contenu audio dans le script qui fait apparaître l'image. Une bonne pratique est de de mander avant d'imposer un son ou une musique et toujours laisser le choix de désactiver la fonctionnalité.

https://www.w3schools.com/jsref/met_audio_play.asp

Notez que ce type de pratique n'est pas conseillé car pas ergonomique. Le web est centré sur l'utilisateur c'est lui qui doit être privilégié. Il peut ne pas avoir envie d'avoir un son(surtout à chaque chargement de la page c'est plutôt ennuyant) ou simplement ne pas avoir de son actif ou le son est au mmaximum et il va sursauter ou il consulte plusieurs pages ou écoute de la musique et le son sera au minimum une nuisance pour lui.

Bref à utiliser avec parcimonie et précaution.

0

Bonjour Tomawk et merci de ton aide.

Oui simplement jouer le son "roulement de tambour.mp3" une seule fois au chargement de l'image "logo.gif" . "logo.gif" apparait dynamiquement avec le son "roulement de tambour.mp3"

Avec ce code (ci-dessous) le son ne démarre pas automatiquement avec le rafraichissement de la page (F5). Je ne souhaite pas voir le lecteur sur ma page , le lecteur doit être invisible. Je ne pense pas non plus que le son soit lier uniquement à l'image (logo.gif).

Je suis novice en la matière , encore merci de ton aide.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Lecteur MP3</title>
	
</head>
<body>
<audio controls autoplay>  
  <source src="roulement de tambour.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
	<div>		
			<img src="logo.gif" alt="Papy Nono Batterie" class="image" />
		</a>
	</div>
</body>
</html>
0