Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript
JavaScript Forum programmation JavaScript. Lire : Cours JavaScript, FAQ JavaScript, Toutes les FAQ JavaScript et Sources JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 03/08/2011, 09h45   #1
Nouveau Membre du Club
 
Oriane
Inscription : mai 2010
Messages : 33
Détails du profil
Informations personnelles :
Nom : Oriane
Âge : 22

Informations forums :
Inscription : mai 2010
Messages : 33
Points : 26
Points : 26
Par défaut Javascript dans une image map

Bonjour,

Le site internet que je suis en train de réaliser contient une image map, celle-ci fonctionne parfaitement sur tous les navigateurs, sauf sur Internet Explorer.
J'ai bien l'affichage en étiquette de mes titres, mais aucune réaction pour les fonctions javascript associées.
Voici mes codes (les balises title et alt contiennent des noms de personnes que je ne souhaite pas communiquer ici) :

Code html :
Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<map id="conseil_municipal">
    <area shape="rect" coords="0,50,30,100"   	title="" alt=""  onmouseover="selection('nom_cm1'); CacheTout('cm'); DivStatus('cm1'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm1');" />
    <area shape="rect" coords="75,80,110,120"  	title="" alt=""  onmouseover="selection('nom_cm2'); CacheTout('cm'); DivStatus('cm2'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm2');" />
    <area shape="rect" coords="150,75,180,120" 	title="" alt=""    onmouseover="selection('nom_cm3'); CacheTout('cm'); DivStatus('cm3'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm3');" />
    <area shape="rect" coords="220,90,250,130"  title="" alt=""   onmouseover="selection('nom_cm4'); CacheTout('cm'); DivStatus('cm4'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm4');" />
    <area shape="rect" coords="270,95,305,130"  title="" alt=""	    onmouseover="selection('nom_cm5'); CacheTout('cm'); DivStatus('cm5'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm5');" />
    <area shape="rect" coords="350,90,390,140"  title="" alt="" 	onmouseover="selection('nom_cm6'); CacheTout('cm'); DivStatus('cm6'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm6');" />
    <area shape="rect" coords="35,40,75,90"  	title="" alt=""     onmouseover="selection('nom_cm7'); CacheTout('cm'); DivStatus('cm7'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm7');" />
     <area shape="rect" coords="120,73,145,115"  title="" alt="" onmouseover="selection('nom_cm8'); CacheTout('cm'); DivStatus('cm8'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm8');" />
    <area shape="rect" coords="185,80,215,120"  title="" alt="" onmouseover="selection('nom_cm9'); CacheTout('cm'); DivStatus('cm9'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm9');" />
    <area shape="rect" coords="225,50,255,85"   title="" alt="" onmouseover="selection('nom_cm10'); CacheTout('cm'); DivStatus('cm10'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm10');" />
    <area shape="rect" coords="310,70,340,120"  title="" alt=""     onmouseover="selection('nom_cm11'); CacheTout('cm'); DivStatus('cm11'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm11');" />
    <area shape="rect" coords="80,40,115,75"   	title="" alt=""   onmouseover="selection('nom_cm12'); CacheTout('cm'); DivStatus('cm12'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm12');" />
    <area shape="rect" coords="130,40,170,70"   title="" alt="" onmouseover="selection('nom_cm13'); CacheTout('cm'); DivStatus('cm13'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm13');" />
    <area shape="rect" coords="180,40,220,75"   title="" alt=""  onmouseover="selection('nom_cm14'); CacheTout('cm'); DivStatus('cm14'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm14');" />
    <area shape="rect" coords="260,50,290,90"   title=""  alt=""   onmouseover="selection('nom_cm15'); CacheTout('cm'); DivStatus('cm15'); cacheDiv('consignes');" onmouseout="fin_selection('nom_cm15');" />
</map>
 
<img src="<?php echo $chem; ?>images/conseil_municipal.jpg" alt="conseil municipal" id="img_conseil" usemap="#conseil_municipal" />
Fonctions javascript :
Code :
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
function DivStatus( divID )
{//	var divID = nom + numero;
	if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
	{	Pdiv = document.getElementById( divID );
		PcH = true;
 	}
	else if ( document.all && document.all[ divID ] ) // Pour les veilles versions
	{	Pdiv = document.all[ divID ];
		PcH = true;
	}
	else if ( document.layers && document.layers[ divID ] ) // Pour les très veilles versions
	{	Pdiv = document.layers[ divID ];
		PcH = true;
	}
	else
	{	PcH = false;
	}
	if ( PcH )
	{	Pdiv.style.display = ( Pdiv.style.display == 'none' ) ? 'block' : 'none';
	}
}
 
/*
* Cache tous les divs ayant le même préfixe
*/
function CacheTout( nom )
{		 var NumDiv = 1;
		 if ( document.getElementById ) // Pour les navigateurs récents
		{	while ( document.getElementById( nom + NumDiv) )
			{	SetDiv = document.getElementById( nom + NumDiv );
				if ( SetDiv && SetDiv.style.display != 'none' )
				{	DivStatus( nom + NumDiv );
				}
				NumDiv++;
			}
		}
		else if ( document.all ) // Pour les veilles versions
		{	while ( document.all[ nom + NumDiv ] )
			{	SetDiv = document.all[ nom + NumDiv ];
				if ( SetDiv && SetDiv.style.display != 'none' )
				{	DivStatus( nom + NumDiv );
				}
				NumDiv++;
			}
		}
		else if ( document.layers ) // Pour les très veilles versions
		{	while ( document.layers[ nom + NumDiv ] )
			{	SetDiv = document.layers[ nom + NumDiv ];
				if ( SetDiv && SetDiv.style.display != 'none' )
				{	DivStatus( nom + NumDiv );
				}
				NumDiv++;
			}
		}
}
 
 
function selection(id)
{	document.getElementById(id).style.color = "#CA3200";
	document.getElementById(id).style.fontWeight = "bold";
}
function fin_selection(id)
{	document.getElementById(id).style.color = "#555";
	document.getElementById(id).style.fontWeight = "normal";
}
Voilà, Internet Explorer me dit "Cet objet ne gère pas cette action".
Je précise qu'il y a du javascript ailleurs dans le site et que cela fonctionne.

En espérant avoir des réponses, voire même la solution à mon problème !

Cordialement,

Oriane
Oriane85 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 03/08/2011, 10h11   #2
Modérateur
 
Avatar de NoSmoking
 
Homme
Inscription : janvier 2011
Messages : 2 944
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : France, Isère (Rhône Alpes)

Informations forums :
Inscription : janvier 2011
Messages : 2 944
Points : 4 776
Points : 4 776
Bonjour,
3 choses
- pour commencer supprimes de ton code toutes les références à document.all et document.layer
- passes par des changements de class pour la modification de l'aspect
- sur quelle ligne apparaît l'erreur
NoSmoking est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 03/08/2011, 10h38   #3
Nouveau Membre du Club
 
Oriane
Inscription : mai 2010
Messages : 33
Détails du profil
Informations personnelles :
Nom : Oriane
Âge : 22

Informations forums :
Inscription : mai 2010
Messages : 33
Points : 26
Points : 26
Merci pour votre réponse, cela fonctionne.
Par contre, les références à document.all et document.layer fonctionnaient très bien sur un autre site. Cela vient plutôt des modifications d'aspect alors ?
Pour l'erreur, cela apparaissait à la ligne correspondant à la personne survolée.

Merci pour votre aide.
Oriane85 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 03/08/2011, 10h51   #4
Responsable Développement Web

 
Avatar de Bovino
 
Homme Didier Mouronval
Développeur Web
Inscription : juin 2008
Messages : 13 807
Détails du profil
Informations personnelles :
Nom : Homme Didier Mouronval
Âge : 41
Localisation : France, Gironde (Aquitaine)

Informations professionnelles :
Activité : Développeur Web
Secteur : High Tech - Éditeur de logiciels

Informations forums :
Inscription : juin 2008
Messages : 13 807
Points : 35 797
Points : 35 797
document.all et document.layers étaient utiles jusqu'à IE4 et Netscape 4... Autant dire qu'il est préférable de les ranger dans les oubliettes de la mémoire
__________________
Pas de question technique par MP !
Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi !
Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
Mon livre sur jQuery
Bovino est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 03/08/2011, 17h17   #5
Modérateur
 
Avatar de NoSmoking
 
Homme
Inscription : janvier 2011
Messages : 2 944
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : France, Isère (Rhône Alpes)

Informations forums :
Inscription : janvier 2011
Messages : 2 944
Points : 4 776
Points : 4 776
si c'est résolu tant mieux, mais je doit admettre que je n'ai pas compris comment!
NoSmoking est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 03/08/2011, 17h37   #6
Nouveau Membre du Club
 
Oriane
Inscription : mai 2010
Messages : 33
Détails du profil
Informations personnelles :
Nom : Oriane
Âge : 22

Informations forums :
Inscription : mai 2010
Messages : 33
Points : 26
Points : 26
Et bien, en modifiant mes fonctions de modifications d'aspect (selection et fin_selection).
Merci quand même !
Oriane85 est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 12h18.


 
 
 
 
Partenaires

Hébergement Web