Aller au menu - Aller au contenu

Comment diffuser un son au survol d'une image

Je cherche depuis un bout de temps ...

Vous devez être inscrit pour pouvoir poster des messages

Résolu Le problème de ce sujet a été résolu

Page : 1 
Auteur Message
1 visiteur sur ce sujet (1 anonyme)
Page : 1 
Hors ligne Samus # Posté le 17/12/2007 à 21:33:48
Bouffe moi le c#$ !!!
Avatar
Groupe : Membres
:( Bonjour,

j'aimerais savoir comment diffuser un son suite au survol d'une image par la souris.
Je créé mon site en html, et j'aimerais une méthode assez simple.

Merci d'avance. ;)
Mon site perso ici
Mon site pro !!! ici
 
Hors ligne Thunderseb # Posté le 17/12/2007 à 21:59:58
1, 1, 1, uhmmm... 1
Avatar
Validateurs
C'est pas super simple à mettre en œuvre. Il te faut du Javascript pour exécuter l'action et jouer le son. Pour jouer le son, ça peut se faire directement en javascript (pas conseillé), ou par l'intermédiaire d'une animation Flash invisible, que javascript active :) .

J'ai un exemple avec la solution avec du Flash :

Code : HTML - a placer dan sle HEAD de la page - Afficher / masquer les numéros de ligne
  1. <script type="text/javascript">
  2. function jouerSon(url) {
  3.         var swf = 'http://fieldset.cliranet.com/blabla/privat/fieldset.swf';
  4.         var html = '<object data="'+swf+'?son='+url+'" type="application/x-shockwave-flash" width="0" height="0"><param name="movie" value="'+swf+'?son='+url+'" /></object>';
  5.         document.getElementById('son').innerHTML = html;
  6. }
  7. </script>


Code : HTML - a placer dans la page - Afficher / masquer les numéros de ligne
  1. <div id="son"></div>
  2. <p><a href="javascript:void(0);" onclick="jouerSon('http://fieldset.cliranet.com/blabla/privat/sons/poc.mp3');">Jouer le son</a></p>


J'ai fais ce code en vitesse avec la petite animation que j'avais faite pour un copain (Fieldset). Si tu choisi cette solution, tu dois prendre et uploader sur ton FTP le fichier http://fieldset.cliranet.com/blabla/privat/fieldset.swf ;)

Après tu dois adapter ce code à tes besoins ;)

Smilies | Vidéos en Flash | Ça puxx | Browsers | L4D | Geek-Gaming
RealFox | FoxyCode | AJAX et l'échange de données en JavaScript
Une map pour Half-Life² avec Hammer 4 | Protect the witch | Berpj
 
Hors ligne Samus # Posté le 17/12/2007 à 22:16:15
Bouffe moi le c#$ !!!
Avatar
Groupe : Membres
Merci pour avoir répondu si vite !!
Je teste ça le plus vite possible,
à bientôt ...
:D
Mon site perso ici
Mon site pro !!! ici
 
Hors ligne Fieldset # Posté le 18/12/2007 à 07:44:29
Avatar
Groupe : Membres
Hey :D Je connais ce code :D

Merci encore à toi mon pti Thunderseb :D
Édité le 18/12/2007 à 07:44:58 par Fieldset
Pour vous aider à débuger vos script JavaScript, installez FireBug (Un module pour FireFox)
 
Hors ligne Thunderseb # Posté le 18/12/2007 à 11:50:18
1, 1, 1, uhmmm... 1
Avatar
Validateurs
^^ J'ai dis "Fieldset" et tes oreilles ont fait tilt ^^

Smilies | Vidéos en Flash | Ça puxx | Browsers | L4D | Geek-Gaming
RealFox | FoxyCode | AJAX et l'échange de données en JavaScript
Une map pour Half-Life² avec Hammer 4 | Protect the witch | Berpj
 
Hors ligne Samus # Posté le 18/12/2007 à 13:49:12
Bouffe moi le c#$ !!!
Avatar
Groupe : Membres
Merci à toi ça marche niquel !!!
J'ai juste modifié le onclick par un onmouseover et c'est exactement ce que je désirais!!

Franchement ton aide m'a bien aidé, alors bonne continuation a toi!!! :D :D
Mon site perso ici
Mon site pro !!! ici
 

Retour au forum "XHTML / CSS" ou à la liste des forums

Vous devez être inscrit pour pouvoir poster des messages