Webmaster Hub: Accordeon - Webmaster Hub

Aller au contenu

Page 1 sur 1
  • Vous ne pouvez pas commencer un sujet
  • Vous ne pouvez pas répondre à ce sujet

Accordeon

#1 L'utilisateur est hors-ligne   Hugo38 

  • Groupe : Webmaster Régulier
  • Messages : 57
  • Inscrit(e) : 06-janvier 10

Posté 15 février 2011 - 14:30

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.

Ce message a été modifié par Hugo38 - 15 février 2011 - 14:32.

0

Partager ce sujet :


Page 1 sur 1
  • Vous ne pouvez pas commencer un sujet
  • Vous ne pouvez pas répondre à ce sujet

1 utilisateur(s) en train de lire ce sujet
0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)