Discussion :

[Shadam]

Bonjour,

Je cherche à "ouvrir"/"fermer" des div avec une fonction javascript.

Appel de la fonction :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="image" id="fleche" name="imgdivCompetences" src="http://icdn.pro/images/fr/f/l/fleche-vers-bas-icone-9481-96.png" onclick="Block(divCompetences)"/>

La fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
function Block(ctrl)
 {
	var imgName;
	imgName = 'img' + ctrl;
	var current;
	current = (document.getElementById(ctrl).style.display == 'none') ? 'block' : 'none';
	if (current=='none') {
		document.getElementById(imgName).src = document.getElementById('flecheHaut').value;
	} else {
		document.getElementById(imgName).src = document.getElementById('flecheBas').value;
	}
 }

Mes deux éléments 'flecheHaut' et 'flecheBas' sont des HiddenFields dont le value est l'url de l'image qui m'intéresse.

Da'illeurs à l'instanciation de ma page je voudrais directement les appeler mais je n'y arrive pas :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="image" id="fleche" name="imgdivCompetences" src="document.getelementbyid('flecheBas').value;" onclick="Block(divCompetences)"/>

Merci de votre aide

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById(imgName).src

a tout hasard tu passe le name ou l'id en paramètre ?

[Shadam]

Oui effectivement je viens de me rendre compte que je passais le name

J'ai donc corrigé ça :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="image" id="fleche" name="imgdivFormation" src="http://icdn.pro/images/fr/f/l/fleche-vers-bas-icone-9481-96.png" onclick="blocking('divFormation')"/>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 function blocking(ctrl)
 {
	var imgName;
	imgName='img'+ctrl;
	var current;
	current=(document.getElementById(ctrl).style.display=='none')?'block':'none';
	if (current=='none') {
		document.getElementById(imgName).src=document.getElementById('flecheBas').value;
		document.getElementById(ctrl).style.display='none';
	} else {
		document.getElementById(imgName).src=document.getElementById('flecheHaut').value;
		document.getElementById(ctrl).style.display='block';
	}
 }

Et ça fonctionne très bien, même le block/none que j'ai rajouté entre temps.

Par contre je n'arrive toujours pas à afficher l'image comme ça :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="image" id="fleche" name="imgdivCompetences" src="javascript:document.getElementById('flecheHaut').value" onclick="blocking('divCompetences')"/>

[SpaceFrog]

src n'accepte pas de js ...

il faut passer par le onlaod de la page et attribuer ton src à ce moment là

[Shadam]

Parfait ! Ca fonctionne du tonerre de Dieu !

Merci SpaceFrog !

[Shadam]

J'ai enlevé le résolu parce qu'il s'avère que mon code js ne s'exécute que sur IE et pas sur firefox ni chrome...

J'en suis là :

Code :

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
 function blocking(ctrl)
 {
	var imgName;
	imgName='img'+ctrl;
	var current;
	current=(document.getElementById(ctrl).style.display=='none')?'block':'none';
	if (current=='none') {
		document.getElementById(imgName).src=document.getElementById('flecheBas').value;
		document.getElementById(ctrl).style.display='none';
	} else {
		document.getElementById(imgName).src=document.getElementById('flecheHaut').value;
		document.getElementById(ctrl).style.display='block';
	}
	return false;
 }
 
 window.onload=function(){
	blocking('divCompetences');
	blocking('divFormation');
	blocking('divExperience');
	blocking('divLoisirs');
	return false;
	};

et les appels :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="image" id="fleche" name="imgdivCompetences" src="" onclick="blocking('divCompetences')"/>

Et donc tout fonctionne nickel sur IE et rien ne se passe sur chrome et firefox...