Sujet Précédent Sujet Suivant

Combiner 2 scripts rollover sur la meme image

Fermé
jeanpapou - 21 nov. 2007 à 10:42
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 - 22 nov. 2007 à 14:37
Bonjour,
j'aimerai savoir si c'est possible de combiner 2 javascripts sur la meme image ?
comme par exemple le "rollover"classique générer dans dreamweaver (avec fonction preload)
...<A HREF="YourPage.html" onMouseOut="'MM_swapImgRestore()" onMouseOver="'MM_swapImage('img01','','img_index/img_01.jpg',1)">

et un javascript qui genere du son au passage de la souris
<A HREF="YourPage.html" onMouseOver="playSound(0)" onMouseOut="stopSound(0)">

sachant evidemment qu'il y a 2 javascripts entre <head> et </head>

merci beaucoup par avance a ceux qui repondront

jeanpapou
A voir également:

6 réponses

Réponse 1 / 6
jeanpapou
21 nov. 2007 à 13:09
salut christounet

merci d avoir repondu rapidement
je suis en train d essayer mais ca ne marche pas pour l instant

voici mes 2 codes pour que j espere tu puisses m aider encore une fois :

le premier générer par dreamweaver

<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

<a href="mapage.htm" onMouseOut="'MM_swapImgRestore()" onMouseOver="'MM_swapImage('img01','','img_index/img_02.jpg',1)">

-------------------------------------

et le 2eme pour le son

<script LANGUAGE="JavaScript">

var aySound = new Array();

aySound[0] = "musique/son.wav";

document.write('<BGSOUND ID="auIEContainer">')
IE = (navigator.appVersion.indexOf("MSIE")!=-1 && document.all)? 1:0;
NS = (navigator.appName=="Netscape" && navigator.plugins["LiveAudio"])? 1:0;
ver4 = IE||NS? 1:0;
onload=auPreload;

function auPreload() {
if (!ver4) return;
if (NS) auEmb = new Layer(0,window);
else {
Str = "<DIV ID='auEmb' STYLE='position:absolute;'></DIV>";
document.body.insertAdjacentHTML("BeforeEnd",Str);
}
var Str = '';
for (i=0;i<aySound.length;i++)
Str += "<EMBED SRC='"+aySound[i]+"' AUTOSTART='FALSE' HIDDEN='TRUE'>"
if (IE) auEmb.innerHTML = Str;
else {
auEmb.document.open();
auEmb.document.write(Str);
auEmb.document.close();
}
auCon = IE? document.all.auIEContainer:auEmb;
auCon.control = auCtrl;
}
function auCtrl(whSound,play) {
if (IE) this.src = play? aySound[whSound]:'';
else eval("this.document.embeds[whSound]." + (play? "play()":"stop()"))
}
function playSound(whSound) { if (window.auCon) auCon.control(whSound,true); }
function stopSound(whSound) { if (window.auCon) auCon.control(whSound,false); }

</script>


voila
c long
si tu as une autre reponse je suis preneur
ou alors je n'ai pas bien applique ce que tu m'as dit

merci encore
je mets les mains dans le camboui de nouveau

jeanpapou
1
Réponse 2 / 6
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387
21 nov. 2007 à 11:53
Bonjour,

Pour faire cela utilise la méthode suivante:

<A HREF="YourPage.html" onMouseOver="OverFct()" onMouseOut="OutFct()">

Défini un nouveau Javascript

<script type="text/javascript">
function OverFct()
{
MM_swapImage('img01','','img_index/img_01.jpg',1);
playSound(0);
}
function OutFct()
{
MM_swapImgRestore();
stopSound(0);
}
</script>

Celà devrait faire l'affaire

Salut
0
Réponse 3 / 6
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387
21 nov. 2007 à 13:18
Bonjour,

Peux-tu copier/coller tout le contenu de ta page, et pas seulement les deux scripts ?

Celà me permettra de tester ton code HTML et Javascript et éventuellement de corriger et de te renvoyer la nouvelle version.

Merci

A plus
0
jeanpapou
21 nov. 2007 à 13:48
re lut

qd j'ai essayé ton code tout a l heure ya plus rien qui a marché du coup, ni le rollover ni le son,
car sinon tout marche mais en séparé

voici ma page simplifié

<html>
<head>
<title>jeanpapou</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body bgcolor="#000000" onLoad="MM_preloadImages('img_index/image_02.jpg')">
<p> </p>
<p> </p>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><a href="mapage" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image1','','img_index/image_02.jpg',1)"><img src="img_index/image_01.jpg" alt="cliquer ici" name="Image1" width="160" height="225" border="0"></a></td>
<td><img src="img_index/image_03.jpg" width="480" height="275"></td>
</tr>
</table>
</body>
</html>


en fait pour la petite histoire je voulais rajouter un petit bruit au moment ou on survole "l'image_01" (qui par la meme occasion se transforme en "image_02")
et j'ai trouvé le script du son que je t'ai donné tout a l'heure sur ce site :

http://www.javascriptkit.com/script/script2/soundlink.shtml

encore et encore merci por ton aide

jeanpapou
0
Réponse 4 / 6
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387
21 nov. 2007 à 14:31
Bonjour,

Volià ci-dessous tu trouveras ton code HTML légerement changé, j'ai testé et celà fonctionne. Bien sur j'ai dû changer le nom du fichier de son ainsi que le nom des images pour pouvoir tester sur mon PC (en gras les changements principaux)

<html>
<head>
<title>jeanpapou</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

<script LANGUAGE="JavaScript"><!--
// Preload and play audio files with event handler (MouseOver sound)
// designed by JavaScript Archive, (c)1999
// Get more free javascripts at http://jsarchive.8m.com

var aySound = new Array();
// Below: source for sound files to be preloaded
aySound[0] = "asterisk.wav";

// DO NOT edit below this line
document.write('<BGSOUND ID="auIEContainer">')
IE = (navigator.appVersion.indexOf("MSIE")!=-1 && document.all)? 1:0;
NS = (navigator.appName=="Netscape" && navigator.plugins["LiveAudio"])? 1:0;
ver4 = IE||NS? 1:0;

function auPreload() {
if (!ver4) return;
if (NS) auEmb = new Layer(0,window);
else {
Str = "<DIV ID='auEmb' STYLE='position:absolute;'></DIV>";
document.body.insertAdjacentHTML("BeforeEnd",Str);
}
var Str = '';
for (i=0;i<aySound.length;i++)
Str += "<EMBED SRC='"+aySound[i]+"' AUTOSTART='FALSE' HIDDEN='TRUE'>"
if (IE) auEmb.innerHTML = Str;
else {
auEmb.document.open();
auEmb.document.write(Str);
auEmb.document.close();
}
auCon = IE? document.all.auIEContainer:auEmb;
auCon.control = auCtrl;
}
function auCtrl(whSound,play) {
if (IE) this.src = play? aySound[whSound]:'';
else eval("this.document.embeds[whSound]." + (play? "play()":"stop()"))
}
function playSound(whSound) { if (window.auCon) auCon.control(whSound,true); }
function stopSound(whSound) { if (window.auCon) auCon.control(whSound,false); }
//-->
</script>

<script type=text/javascript>
function LoadImgSound()
{
MM_preloadImages('button2.jpg');
auPreload();
}
function OverFct()
{
MM_swapImage('Image1','','button2.jpg',1);
playSound(0);
}
function OutFct()
{
MM_swapImgRestore();
stopSound(0);
}
</script>

</head>

<body bgcolor="#000000" onLoad="LoadImgSound()">
<p> </p>
<p> </p>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><a href="mapage" onMouseOut="OutFct()" onMouseOver="OverFct()">
<img src="button1.jpg" alt="cliquer ici" name="Image1" width="100" height="20" border="0"></a></td>
<td><img src="button12.jpg" width="480" height="275"></td>
</tr>
</table>
</body>


</html>
0
jeanpapou
21 nov. 2007 à 14:53
Bonjour,


super ca marche !!!

merci christounet

par contre denière chose, ca m'a rajouté une sorte de petit carré translucide au bord blanc en bas a gauche de ma page
(c'est tres etrange) qui apparait qd je fais un essai sur mon ordi mais pas dans dreamweaver

est-ce du au fait que j'ai trop de script dans ma page ou je ne sais quoi

merci dans tous les cas

jeanpapou
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 6
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387
21 nov. 2007 à 14:58
Bonjour,

Content que celà fonctionne.

Concernant le petit carré noir, c'est normal car le code Javascript de la fonction auPreload ajoute le code HTML suivant dans ta page (en gras dans le texte):

function auPreload() {
if (!ver4) return;
if (NS) auEmb = new Layer(0,window);
else {
Str = "<DIV ID='auEmb' STYLE='position:absolute;'></DIV>";
document.body.insertAdjacentHTML("BeforeEnd",Str);
}
var Str = '';
for (i=0;i<aySound.length;i++)
Str += "<EMBED SRC='"+aySound[i]+"' AUTOSTART='FALSE' HIDDEN='TRUE'>"
if (IE) auEmb.innerHTML = Str;
else {
auEmb.document.open();
auEmb.document.write(Str);
auEmb.document.close();
}
auCon = IE? document.all.auIEContainer:auEmb;
auCon.control = auCtrl;
}

N'oublie pas d'indiquer que ton problème est résolu, merci

A plus
0
jeanpapou
21 nov. 2007 à 21:24
Bonjour,


ok merci
je rentre du taf c pourquoi je ne t'ai pas repondu plus tot

je vais enlever le petit carre
merci


si tu veux me donner ton adresse e mail pour que je puisse te remercier sur mon site qd il sera en ligne pas de souci
(et pour que je te donne l'url du site)

oregilles@yahoo.fr

jeanpapou
0
jeanpapou
21 nov. 2007 à 22:03
Bonjour,

en fait je n'arrive pas à l'enlever je me suis un peu emballé
(peut etre c'est pas possible ?....)

et puis je sais pas comment dire que le probleme est resolu

decidemment...

jeanpapou
0
Réponse 6 / 6
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387
22 nov. 2007 à 12:07
Bonjour,

Normalement en haut de ton prochain message tu dois avoir une case à cocher pour signaler que ton problème est résolu.

Concernant le petit carré, je vais essayer de trouver quel code utiliser pour le rendre invisible.

A plus
0
jeanpapou
22 nov. 2007 à 14:31
merci
je cherche de mon coté egalement

@++

jeanpapou
0
Christounet Messages postés 1264 Date d'inscription mercredi 26 septembre 2007 Statut Membre Dernière intervention 29 juillet 2010 1 387 > jeanpapou
22 nov. 2007 à 14:37
Salut,

Je crois que j'ai trouvé, il faut ajouter "display:none" dans la définition du DIV, ci-dessous ligne changée en gras

function auPreload() {
if (!ver4) return;
if (NS) auEmb = new Layer(0,window);
else {
Str = "<DIV ID='auEmb' STYLE='position:absolute;display:none;'></DIV>";

A plus
0

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?
Raven -
Tainavictor -

9 réponses
A3 paysage en deux A4...est-ce possible?
nikoss -
Lilo -

10 réponses
Dechiffrer une image caché
JACQUE -
Otomec -

1 réponse
Comment enlever le rouge sur la photo svp ?
lucas0909 -
bazfile -

11 réponses