begin process at 2012 05 29 16:55:43
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

Problème insoluble (?) de son

Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Problème insoluble (?) de son

mercredi 10 novembre 2010 à 15:33:47 | Problème insoluble (?) de son

rasmulti
Bonjour,

je voudrais jouer un son au survol d'une image.
Avec javascript pas de problème.
Mais, pour compliquer les choses, cette image est traitée en rollover par css.
La page affiche en miniature la liste des images et quand on survole chaque miniature, celle-ci s'affiche agrandie, à côté de la colonne de miniatures.

Donc, l'affectation du son par javascript se fait sur l'image agrandie et on n'y a pas accès puis qu'elle affichée par rollover en css.

Je cherche depuis des jours à affecter le son à la miniature, ou que le survol de la miniature déclenche à la fois l'agrandissement ET la lecture du son.

Je ne voudrais pas être obligé de gérer l'agrandissement de la miniature par javavscript, car je serai obligé de créer, de stocker et d'afficher la miniature. Mais s'il le faut...

Voici mon code :
* les div où s'affichent les miniatures :
Code HTML :
#thumbsg a:hover {
	border-color: #ddd;
	t
}
#thumbsd a:hover {
	border-color: #ddd;
}
#thumbsg a:hover img {
	position: absolute;
	width: auto;
	height: auto;
	margin-top: 75px;
	left: 120px;
	top: 0;
	border: 1px solid #333;

* le code html :
Code HTML :
.....
<script>
function PlaySound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Play();
};

function StopSound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Stop();
}
</script>
  </head>
  <body align="center">
    <div id="gallery" align="center"><br /><b>Fermez la fenêtre pour retrouver le menu</b>
		</div>
      <div id="thumbsg">
        <a href="#1">
          <img src="plan/ch1_1c.jpg" width="1024" height="682" title="Chambre 1" alt="Chambre 1" onmouseover="PlaySound('sound1')" onmouseout="StopSound('sound1')" /></a><embed src="chien.wav" autostart=false width=0 height=0 id="sound1" enablejavascript="true">

Voici la page en ligne :
Code HTML :
http://linformatique.info/loc/plan.html


Merci de votre aide, toute solution est la bienvenue.
jeudi 11 novembre 2010 à 10:27:07 | Re : Problème insoluble (?) de son

PetoleTeam

Membre Club
Bonjour,
déplaces les événements onmouseover et onmouseout sur la balise A

;O)
jeudi 11 novembre 2010 à 19:18:55 | Re : Problème insoluble (?) de son

rasmulti
Merci, mais rien à faire.
Est-ce bien comme ceci qu'il faut faire :
Code HTML :
<a href="#1" onmouseover="PlaySound('sound1')" onmouseout="StopSound('sound1')">
<img src="plan/ch1_1c.jpg" width="1024" height="682" title="Chambre 1" alt="Chambre 1"/></a>
<embed src="chien.wav" autostart=false width=0 height=0 id="sound1" enablejavascript="true">
jeudi 11 novembre 2010 à 20:22:10 | Re : Problème insoluble (?) de son

rasmulti
Stop...
ça fonctionne !
merci du tuyau.
A noter : il vaut mieux que les sons soient au format .wav. Je ne sais pas pourquoi les .mp3 fonctionnent une fois sur deux.

D'autre part, ça ne fonctionnait pas au départ, car j'utilisais Firefox et j'avais désinstallé Java, suit à un trojan qui est arrivé dans une faille de sécurité de java. Son nom, pour ceux que ça intéresse : JAVA/Agent.AH et dérivés : JAVA/Agent.AL.3 et .AJ.4
Seul Avira a pu le neutraliser (version 10)
Et pourtant j'étais à jour pour java, suite aux problèmes qu'ils ont déjà eu il y a 2-3 mois.

Ensuite, je suis surpris que le login de javascript.fr appelle java ?! (ou alors mon Firefox a eu des misères...)

Enfin, j'ai découvert un navigateur formidable, Maxthon 3. Essayez-le, ça vaut le coup d'oeil (je n'ai pas d'actions chez eux...)

Donc, problème résolu et encore merci à PetroleTeam (pas en pénurie d'idées !).

P.S : ci-dessous le bon code pour ceux que ça intéresse :
entre les balises <head> :
Code HTML :
<script>
function PlaySound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Play();
};

function StopSound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Stop();
}
</script>

et dans le <body> :
Code HTML :
<a href="#1" onmouseover="PlaySound('sound1')" onmouseout="StopSound('sound1')">
<img src="votreimage.jpg" width="1024" height="682" title="votre titre" alt="votre texte"/></a><embed src="votre son1.wav" autostart=false width=0 height=0 id="sound1" enablejavascript="true">
<a href="#2" onmouseover="PlaySound('sound2')" onmouseout="StopSound('sound2')">
<img src="votreimage.jpg" width="1024" height="682" title="votre titre" alt="votre texte"/></a><embed src="votre son2.wav" autostart=false width=0 height=0 id="sound2" enablejavascript="true">

Remarques :
* les sons doivent être courts et au format .wav, car les mp3 fonctionnent un fois sur 2 (pourquoi, je ne sais pas, peut-être les convertir en plus faible qualité ?)
* il faut bien numéroter les id de chaque son, puisque ce sont les fonctions PlaySound et StopSound qui sont appelées
* les attributs title et alt sont facultatifs
* vous pouvez aussi utiliser onclick, onmousedown ou onkeyxxx
@+
jeudi 11 novembre 2010 à 21:56:24 | Re : Problème insoluble (?) de son

PetoleTeam

Membre Club
il semblerait que de la façon dont tu procèdes il y ait une succession de déclenchement de mouseover et mouseout dans la foulée le temps que ton image s'échappe de la balise A pour se positionner, activant puis interrompant la musique.

Essaies peut être ceci
Code HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>...</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
a span {
  display : none;
}
a img {
  width  : 70px;
  height : 70px;
  border : 1px solid #e0e0e0;
}
span img {
  width : auto;
  height : auto;
  border : 0;
}
a:hover span {
  position : absolute;
  margin-top : 75px;
  display : block;
  left : 120px;
  top : 0;
  border : 1px solid #333;
}
</style>
<script type="text/javascript">
function PlaySound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Play();
};

function StopSound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.Stop();
}
</script>
</head>
<body>
<a href="#1" onmouseover = "PlaySound('sound1')" onmouseout ="StopSound('sound1')">
  <img src = "votreimage.jpg" title="votre titre" alt = "votre texte">
  <!-- la même image dans un SPAN -->
  <span>
    <img src="votreimage.jpg" title = "votre titre" alt = "votre texte">
  </span>
</a>
<embed src="votre_son.wav" autostart=false width=0 height=0 id="sound2" enablejavascript="true">
</body>
</html>
je te laisse découvrir...

;O)
vendredi 12 novembre 2010 à 02:59:35 | Re : Problème insoluble (?) de son

jdmcreator

Je ne sais pas pourquoi les .mp3 fonctionnent une fois sur deux.



Tu pourrais essayer SoundManager2, un mélange de Flash et de javascript

JDMCreator
--------
Participez au nouveau projet : la wiki sur le javascript !

fr.jsinfo.wikia.com


Cette discussion est classée dans : code, html, miniature, soundobj, thissound

Répondre à ce message

Sujets en rapport avec ce message

PHP -> récupération du code HTML [ par apside ] bonjour,nous avons une application développée en PHP, et nous devons récupérer le code html de la page en cours dans un fichier en local.Or seuls les recuperer le code html d'un mot selecionné [ par sticky97 ] slt tt le monde, g fais un editeur html et je voudrais récupéré le code html ki entour le mot ou une phrase ke g selectionné par exemple si y a une ba récupéré le code html généré par le php [ par matmax ] J'aimerai ouvrir une page qui contient seulement les données essentielles (générées en php). Donc, peut être qu'il est possible de récupérer ( en java block de code html différent selon navigateur. [ par odl2000 ] Bonjour,J'ai fait des recherches, mais j'ai pas trouvé.Pour un besoin specifique, je souhaiterais pouvoir afficher un bout code html different selon l Masquer le code source "descritption et keywords" dans le HTML [ par phuket ] Bonjour a tous les genis du web,Ma question est que je cherche un moyen pour masquer les code source dans le HTML entre le et le pour les meta keywo pb de code ... [ par cristina49 ] bonjour,on m'a demander de corriger des erreurs dans du code html (pb de script dans la barre d'état en bas de l'écran). le problème c'est que je comp afficher/masquer code html [ par eax ] salut je cherche à afficher et à masquer un tableau html en cliquant sur une imagej'utilise actuellement un code php mais c chiant car ça recharge la afficher un code caractere special et non pas sa valeur [ par nours2001 ] Bonjour,VOici mon probleme,je veux faire un lien vers un fichiers dont le nom comporte un "#", mon#fichier.htmlje veux donc faire un lien vers mon%23f ecrire dans un le code html avec le script javascript [ par clk ] débutante-intégrer du javascript dans du html [ par tcia ] bonjour,j'ai trouvé un code source sur ce sitewww.javascriptfr.com/code.aspx?id=15751j'aimerais l'intégrer à du code html. j'ai donc plusieurs questio


Nos sponsors


Sondage...

Comparez les prix


Samsung Galaxy S
Entre 529€ et 529€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,624 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)