DIV caché pas caché

Version imprimable

26/11/2008, 19h27
madmax54

DIV caché pas caché

Bonjour à tous,

J'espère me trouver dans la bonne section du forum car ma question est complexe.

Pour faire simple :

Je souhaite créer un petit cadre avec bordure et avec une image dedans puis juste a droite ( même coller a l'image) une sorte de flèche qui indiquerait au navigateur lambda de cliquez dessus pour étirer mon cadre vers la droite et afficher la description de l'image et donner l'impression que mon cadre s'allonge vers la droite.

Enfin voila
sa semble compliquer mais j'en suis sure réalisable.

ah oui je sais que c'est possible de réaliser tous sa en flash mais j'aimerais si possible l'éviter.

Donc si vous avez des idées faite moi signe.

Merci à tous.

MAJ :

Alors voila je vien de trouver un petit truc qui pourrait y ressembler sauf que le mien apparaitrais vers la droite.
http://www.developpez.net/forums/d62...p-effet-texte/

Qu'en pensez vous !
26/11/2008, 19h57
HiRoN

Salut,

Le lien que tu donnes ne fonctionne pas (erreur de copier/coller).
Mettre la description dans un div en style="display:none;" et lors du clic sur la "flèche", gérer un document.getElementById('id_de_ton_div).style.display='block'; sur le onclick afin de l'afficher ?
26/11/2008, 20h28
madmax54

Merci pour ton aide,

Pour ce que tu me dis ok c'est assez simple sa je sais faire.
moi ce que je voudrais c'est que justement la visualisation de mon 2em Div se fasse progressivement comme si il augmentais en largeur.

Désolé pour le lien je trouve plu.
Si non ya celui la c'est presque le résultat mais en hauteur moi je le veus en largeur :

Après faut voir si c'est pas dégueulasse leur code car j'aime bien du code propre.

MAJ :

En faite voila j'ai donc repris leur code je modifie de facon a que sa ne soit plus la hauteur mais la largeur.
Seulement voila bin oui quand la largeur deviens a zéro et bien j'ai mon texte qui déborde par le bas normal me direz vous mais comment y remédiez
Merci
26/11/2008, 20h39
HiRoN

Citation:

Envoyé par madmax54

Merci pour ton aide,

Pour ce que tu me dis ok c'est assez simple sa je sais faire.
moi ce que je voudrais c'est que justement la visualisation de mon 2em Div se fasse progressivement comme si il augmentais en largeur.

Désolé pour le lien je trouve plu.
Si non ya celui la c'est presque le résultat mais en hauteur moi je le veus en largeur

Après faut voir si c'est pas dégueulasse leur code car j'aime bien du code propre.

Le code n'est pas valide, et plante sous IE (déjà essayé) ;)
Ton problème touche au Javascript, ce n'est donc pas/plus le bon forum.
26/11/2008, 20h54
madmax54

Ah oui effectivement j'ai pa IE6 sous la main mais sur IE7 sa bug aussi
c'est pour sa que j'aime tant FF.

He bien si vous avez une parade je suis preneur.

Encore merci
26/11/2008, 20h58
SpaceFrog

la parade s'appelle FAQ + recherche ;)

C'est good j'ai trouvé.
Grâce a qui ? grâce a quoi ? grâce a la parade :)

J'ai trouvez une source je l'ai remanié a ma sauce et hop tout bon

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
 
var restaure = new Array;
window.onload=function(){
	restaure['zone2'] = document.getElementById('zone2').offsetHeight;
	document.getElementById('zone2').style.width = '0px';
	document.getElementById('zone2').style.overflow = 'hidden';
	document.getElementById('zone2').style.display = 'none';
}
function swap(elmt){
	elt=document.getElementById(elmt);
	if(elt.style.display=='none'){
		var taille = restaure[elmt];
		elt.style.display = '';
		var timer = setInterval(function(){
			if(taille>elt.offsetWidth){elt.style.width=(elt.offsetWidth+5)+'px'}
			else{elt.style.width='auto';clearInterval(timer)}
		},1);
	}
	else{
		var taille = elt.offsetWidth;
		restaure[elmt] = taille;
		elt.style.overflow='hidden';
		var timer = setInterval(function(){
			if(taille>=5){elt.style.width=taille+'px';taille-=5;}
			else{elt.style.display='none';clearInterval(timer)}
		},1);
	}
}

Merci a vous !