5328 sujets

Sémantique web et HTML

Bonjour,

J'ai 4 groupes de 2 images superposées. Je souhaite déclencher un son en cliquant sur l'image supérieure (olaf.gif)

Je ne sais pas comment gérer les 2 onClick dans les mêmes lignes.

Merci de votre aide.

Cordialement.

 <td align="center" valign="middle"><img src="Images/olaf.gif" width="100" height="75" alt="" onClick="this.src='Images/5.png';" onMouseOut="this.src='Images/5.png' /></td>
      <td width="19%" align="center" valign="middle"></td>
        <td align="center" valign="middle"><img src="Images/olaf.gif" width="100" height="75" alt="" onClick="this.src='Images/non.png';" onMouseOut="this.src='Images/non.png' /></td>
      <td width="19%" align="center" valign="middle"></td>
        <td align="center" valign="middle"><img src="Images/olaf.gif" width="100" height="75" alt="" onClick="this.src='Images/DIABLE.gif';" onMouseOut="this.src='Images/oui.gif' /></td>
      <td width="19%" align="center" valign="middle"></td>
        <td align="center" valign="middle"><img src="Images/olaf.gif" width="100" height="75" alt="" onClick="this.src='Images/oui.gif';" onMouseOut="this.src='Images/oui.gif' /></td>
      <td width="19%" align="center" valign="middle"></td>[code=html]
[/code]
Modifié par Lelouc (02 Apr 2021 - 22:35)
Bonjour
Je souhaite rajouter un onclick pour déclencher un son lorsque l'on clique sur l'image supérieure, mais je ne sais pas ou il faut l'inclure dans la ligne :
 <td align="center" valign="middle"><img src="Images/olaf.gif" width="100" height="75" alt="" onClick="this.src='Images/5.png';" onMouseOut="this.src='Images/5.png' /></td>
Les </td> <td sont générés automatiquement par Dreamweaver.

Modifié par Lelouc (03 Apr 2021 - 17:18)
Bonsoir,
Si je rajoute onclick j'ai bien le son sur l'image souhaitée mais je perd tous les autres critères.

<script>
  function play(){
       var audio = document.getElementById("audio");
       audio.play();
                 }
</script>
		  
        <td align="center" valign="middle"><img src="Images/olaf.gif" value="PLAY"  onclick="play()">
<audio id="audio" src="Sound/TOON.wav" ></audio> width="100" height="75" alt="" onClick="this.src='Images/5.png';" onMouseOut="this.src='Images/5.png' /></td>

Modifié par Lelouc (03 Apr 2021 - 21:33)
c'est mieux comme ça?


<script>
  function play(){
       var audio = document.getElementById("audio");
       audio.play();
  }
</script>
		  
 <td align="center" valign="middle"><img src="Images/olaf.gif" value="PLAY"  onclick="play()">
     <audio id="audio" src="Sound/TOON.wav" width="100" height="75" alt="" onClick="this.src='Images/5.png';" onMouseOut="this.src='Images/5.png'"></audio>
</td>
Bonjour,
Désolé mais j'ai toujours les mêmes problèmes. L'Olaf suivant à perdu le critère : onClick="this.src='Images/non.png'; onMouseOut="this.src='Images/non.png' >

Les images se trouvent dans les cellules d'un tableau, je suppose que c'est l'origine des <td>