Cacher une partie d'une page Web

Résolu
engel_aurelien
Messages postés
8
Date d'inscription
samedi 24 janvier 2004
Statut
Membre
Dernière intervention
11 mars 2006
- 24 mai 2005 à 11:50
JacquesDW
Messages postés
4
Date d'inscription
samedi 19 février 2005
Statut
Membre
Dernière intervention
10 août 2005
- 10 août 2005 à 17:35
Bonjour,

j'ai un formulaire affichant diverse infos mais je souhaiterai en
cacher une partie afin de n'afficher que les infos essentielles.



merci.

8 réponses

la_pin
Messages postés
275
Date d'inscription
mercredi 11 août 2004
Statut
Membre
Dernière intervention
15 décembre 2005

26 mai 2005 à 12:50
Dans le HEAD



<style type="text/css" media="all">

/* Ce style CSS ne dois pas être enlevé, sinon les divs ne se cacherons pas ... */

.cachediv {

visibility: hidden;

overflow: hidden;

height: 1px;

margin-top: -1px;

position: absolute;

}

</style>

<script type="text/javascript">

/*

* Montre / Cache un div

*/

function DivStatus( nom, numero )

{

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.className ( Pdiv.className
'cachediv' ) ? '' : 'cachediv';

}

}



/*

* 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.className !=
'cachediv' )



{



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.className !=
'cachediv' )



{



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.className !=
'cachediv' )



{



DivStatus(
nom, NumDiv );



}



NumDiv++;

}

}

}



/*

* Montre tous les divs ayant le même préfixe

*/

function MontreTout( 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.className != '' )



{



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.className != '' )



{



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.className != '' )



{



DivStatus(
nom, NumDiv );



}



NumDiv++;

}

}

}



/*

* Inverse les divs: Cache les divs visible et montre le divs cachés :)

*/

function InverseTout( nom )

{

var NumDiv = 1;

if ( document.getElementById ) // Pour les navigateurs récents

{


while ( document.getElementById(
nom + NumDiv ) )

{



SetDiv = document.getElementById( nom + NumDiv );



DivStatus( nom, NumDiv );



NumDiv++;

}

}

else if ( document.all ) // Pour les veilles versions

{


while ( document.all[ nom +
NumDiv ] )

{



SetDiv = document.all[ nom + NumDiv ];



DivStatus( nom, NumDiv );



NumDiv++;

}

}

else if ( document.layers ) // Pour les très veilles versions

{


while ( document.layers[ nom +
NumDiv ] )

{



SetDiv = document.layers[ nom + NumDiv ];



DivStatus( nom, NumDiv );



NumDiv++;

}

}

}

</script>



Dans le BODY



- [javascript:DivStatus( 'mondiv', '1' ) Ouvrir/Fermer le Bloc 1]


- [javascript:DivStatus( 'mondiv', '2' ) Ouvrir/Fermer le Bloc 2]


- [javascript:DivStatus( 'mondiv', '3' ) Ouvrir/Fermer le Bloc 3]


- [javascript:DivStatus( 'mondiv', '4' ) Ouvrir/Fermer le Bloc 4]


- [javascript:MontreTout( 'mondiv' ) Ouvrir tous les Blocs]


- [javascript:CacheTout( 'mondiv' ) Fermer tous les Blocs]


- [javascript:InverseTout( 'mondiv' ) Inverser les Blocs]



Bloc
1



Bloc
2



Bloc
3



Bloc
4




Voila, tu as des exemples de divs qui peuvent d'ouvrir, se cacher et se fermer.

Pour modifier le tout à ta guise, je te laisse le faire toi-même !



Merci d'accepter ma réponse si elle te convient !



L'homme n'est pas fait pour travailler, la preuve, ça le fatigue Voltaire
3
la_pin
Messages postés
275
Date d'inscription
mercredi 11 août 2004
Statut
Membre
Dernière intervention
15 décembre 2005

24 mai 2005 à 17:45
suffit de mettre la partie de ton form dans les balises

ton form caché

Merci d'accepter ma réponse si elle te convient !

L'homme n'est pas fait pour travailler, la preuve, ça le fatigue Voltaire
0
engel_aurelien
Messages postés
8
Date d'inscription
samedi 24 janvier 2004
Statut
Membre
Dernière intervention
11 mars 2006

25 mai 2005 à 09:29
ce qui veut dire que je suis obligé d'avoir 2 formulaires différents?
0
la_pin
Messages postés
275
Date d'inscription
mercredi 11 août 2004
Statut
Membre
Dernière intervention
15 décembre 2005

25 mai 2005 à 12:36
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Document sans titre</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>





<form action="" method="post">

Champ 1



Champ 2



Champ 3




Champ 4(caché)



</form>



</html>



Tu n'as qu'un seul formulaire mais un champ est caché.

Tu n'est pas obligé d'avoir 2 formulaires !



Si ma réponse te convient, merci de l'accepter !



L'homme n'est pas fait pour travailler, la preuve, ça le fatigue Voltaire
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
engel_aurelien
Messages postés
8
Date d'inscription
samedi 24 janvier 2004
Statut
Membre
Dernière intervention
11 mars 2006

26 mai 2005 à 09:41
oui c'est pas mal mais saurais-tu comment faire pour par exemple en
cliquant sur un lien ou un bouton ça cache ou affiche le reste du
formulaire?



merci beaucoup
0
engel_aurelien
Messages postés
8
Date d'inscription
samedi 24 janvier 2004
Statut
Membre
Dernière intervention
11 mars 2006

27 mai 2005 à 09:32
merci !
0
abouelfareh1
Messages postés
1
Date d'inscription
dimanche 30 mai 2004
Statut
Membre
Dernière intervention
7 juin 2005

7 juin 2005 à 17:25
excelant idée merci
0
JacquesDW
Messages postés
4
Date d'inscription
samedi 19 février 2005
Statut
Membre
Dernière intervention
10 août 2005

10 août 2005 à 17:35
Bonjour,
ce code marche parfaitement, beau boulot.
Petite question: comment faire pour qu'à l'ouverture d'une page, une DIV soit fermée (cachée) et qu'en cliquent sur le lien "ouvrir/fermer le bloc", la DIV apparaisse ? Je voudrais créer une page de recherche avec un bouton "recherche avancée" qui ouvrirait la DIV contenant des options de recherche plus pointues.

Si vous avez une astuce, je prends :) !
0