Bonjour,
Je ne comprends pas les comportements de mes : onMouseOut, onMouseOver
Partie html(5):
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>index</title> <link rel="stylesheet" type="text/css" href="css/index.css"> <script type="text/javascript" src="javascript/javascript.js"></script> </head> <body> <div id="haut"><br><center><h1>TITRE</h1></center><br></div> <div id="gauche"><center><h1>GAUCHE</h1></center><div id="fond_gauche" onClick="changeType('type1'); afficheResultat('type1');" onMouseOver="survoleLogo('type1');" onMouseOut="survoleLogoOff('');"></div></div><div id="droite"><center><h1>DROITE</h1></center><div id="fond_droit" onClick="changeType('type2'); afficheResultat('type2');" onMouseOver="survoleLogo('type2');" onMouseOut="survoleLogoOff('');"></div></div> <div id="bas"><center><h1>RESULTAT</h1></center></div> </body> </html>
Partie javascript :
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 var typeChoisi = 'vide'; function survoleLogo(type) { if(type == 'type1') { document.getElementById('fond_gauche').innerHTML = '<img src="img/fonds/bleu.png" alt="Type">'; document.getElementById('fond_droit').innerHTML = ""; } else if (type == 'type2') { document.getElementById('fond_droit').innerHTML = '<img src="img/fonds/rouge.png" alt="Type">'; document.getElementById('fond_gauche').innerHTML = ""; } } function survoleLogoOff(type) { if(type == 'type1') { document.getElementById('fond_gauche').innerHTML = ""; } if (type == 'type2') { document.getElementById('fond_droit').innerHTML = ""; } }
En fait au survol du logo rouge ou bleu j'aimerais faire apparaitre le fond lui correspondant (rouge ou bleu).
Puis au click d'un logo, figer le fond sélectionné, occulter l'autre fond ET faire apparaître en bas (résultat) des images, ou tout autre objet (array, collection etc).
Seulement rien ne se comporte comme prévu et je dois cliquer plusieurs fois d'affilée pour afficher le "résultat" en bas.
Mes survols sont aussi très capricieux.
Mon gros soucis est que safari me pose des problèmes de compatibilité, il ne réagit pas, ou mal au onClick et n'affiche rien en "bas" dans résultat, et les onMouseOver "tremblent" et "saturent"
enfin, c'est horrible quoi... (et je ne parle pas de mes couleurs)
Soyez indulgent je débute à peine.
merci à tous,
PS :
Pour une meilleure compréhension, mon projet en zip est disponible via MP
Partager