Jump to content

Accordeon


Hugo38

Recommended Posts

Bonjour a toutes et à tous.

Voila je suis entrain de faire une page avec une liste des préstations fournis par une entreprise, mon but et de faire un accordeon pour que l'on voie seulement les titres de chaque prestations et que lorsque l'on clique dessus le texte et les images se déroule.

J'ai reussi a le faire en suivant mes cours de Javascript mais voila j'ai un soucis, je n'arrive pas a faire le deroulement de la taille du contenu, je suis obligé de lui mettre une valeur fixe et du coup c'est assez embettant.

Voila mon code :

		var obj;
var child;
var openId = '';
var closeId = '';
var ouvrir;
var fermer;
var opacite;

function afficheContenu(id) {
if (openId == id) {
cacheContenu(openId);
openId = '';
return;
}

if (openId != '') cacheContenu(openId);

obj = document.getElementById(id);
child = obj.getElementsByTagName('div');
child[0].style.opacity = '1';
opacite = 1;

openId = id;
obj.style.height= '0px';
ouvrir = 0;
obj.style.display = 'block';
ouvrirContenu();

}

function cacheContenu(id) {
closeId = id;
fermer = 50;
fermerContenu();

}

function ouvrirContenu() {
obj = document.getElementById(openId);
obj.style.height = ouvrir+'px';

if (ouvrir < 50) setTimeout('ouvrirContenu()',1000/50);
else fadeIn();
ouvrir = ouvrir + (50/200)*(1000/50);

}

function fermerContenu() {
obj = document.getElementById(closeId);
obj.style.height = fermer+'px';

if (fermer > 0) setTimeout('fermerContenu()',1000/50);
else obj.style.display = 'none';
fermer = fermer - (50/200)*(1000/50);
}

function fadeIn() {
child = obj.getElementsByTagName('div');
child[0].style.opacity = opacite;

if (opacite < 1) setTimeout('fadeIn()', 1000/50);
opacite = opacite + (1/200)*(1000/50);
}

Les valeurs de la taille du deroulement sont : Le fermer = 50; et le if(ouvrir < 50) setTimeout .... .

Savez vous par quoi je peux remplacer ces deux valeurs pour faire en sorte que la taille du déroulement soit égale au contenue.

Merci d'avance.

Edited by Hugo38
Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...