Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : Cacher/Montrer [ CSS / Général ] (keket)

vendredi 1 février 2008 à 14:10:53 | Cacher/Montrer

keket

Bonjour, je viens vous voir car j'aimerai ajouter a mon site la possibilité de cacher ou de montrer une partie de l'écran.
Je voudrais avoir le même résultat que sur ce site lorsque l'on click sur la croix pour montrer et un click sur un trait pour cacher.
Quelqu'un pourrait me donner une piste ?

Merci bien

vendredi 1 février 2008 à 14:52:46 | Re : Cacher/Montrer
vendredi 1 février 2008 à 14:57:34 | Re : Cacher/Montrer

keket

merci, j'avai vu cette solution. :-)

vendredi 1 février 2008 à 15:09:55 | Re : Cacher/Montrer

keket

Mais j'aurais aimer trouver exactement la même chose que sur ce site.sa aurait été vraiment super !!

vendredi 1 février 2008 à 15:44:37 | Re : Cacher/Montrer

keket

Réponse acceptée !
j'ai trouver ce que je cherchais :

     <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
function Suite(lien,affiche){

    var objet = document.getElementById(affiche); // entre les deux ' tu mes le nom du div que tu veux faire apparaître !
   
    if(objet.style.display == "none" || !objet.style.display){
       
        objet.style.display = "block";
        objet.style.overflow = "hidden";
        lien.innerHTML = "<img src='../../images/bt-open.gif'>";
      
        var hFinal      =     200;  //Hauteur finale (la hauteur une fois que ça aura fini de déplier !)
        var hActuel     =     0;         //Hauteur initiale (la hauteur dès le début !)
      
        var timer;
        var fct =        function ()
        {
                hActuel  +=       20;     //Augmente la hauteur de 20px (tu peux modifier) tous les 40ms !
               
                objet.style.height     =     hActuel      +     'px';
               
                if( hActuel > hFinal)
                {
                        clearInterval(timer);   //Arrête le timer
                        objet.style.overflow    =   'inherit';
                }
        };
        fct();

       
        timer = setInterval(fct,40);    //Toute les 40 ms
       
    }else if(objet.style.display == "block"){
       
        var hFinal      =     0;  //Hauteur finale (la hauteur une fois que ça aura fini de déplier !)
        var hActuel     =     200;         //Hauteur initiale (la hauteur dès le début !)
      
        var timer;
        var fct =        function ()
        {
                hActuel  -=   20;     //Augmente la hauteur de -20px (tu peux modifier) tous les 40ms !
               
                objet.style.height     =     hActuel      +     'px';
               
                if( hActuel < hFinal)
                {
                        clearInterval(timer);   //Arrête le timer
                        objet.style.overflow    =   'inherit';
                        objet.style.display     =   "none";
                }
        };
        fct();

       
        timer = setInterval(fct,40);    //Toute les 40 ms
       

        lien.innerHTML = "<img src='../../images/bt-close.gif'>";
       
    }
}
</script>

et dans le body :

<table>
        <tr >
            <td  style="width: 20px;">
                <script>var popup1="popup1";</script>
                    <a href="javascript:;" onclick="Suite(this,popup1)"><img src='../../images/bt-close.gif'></a>
            </td>
            <td class="etat_titre" style="width: 700px;">
                Recherche Développement :
            </td>
            </td>
        </tr>
        <tr>
            <td colspan=2>
                <div id="popup1" style="display: none; border: #000000 2px solid;">
                </div>
            </td>
        </tr>
</table>

vendredi 1 février 2008 à 15:54:25 | Re : Cacher/Montrer

PetoleTeam

Membre Club
Réponse acceptée !
Il faut t'inspirer du principe
exemple
<html>
<head>
<style type="text/css">
body {
  font-size : 13px;
  font-family : Verdana;
}
#D_MAIN {
  background-color : #bbccef;
  border : 1px solid blue;
  width :210px;
}
#D_1 {
  background-color : #ffffff;
  border : 1px solid blue;
  width : 200px;
  margin : 2px;

}
</style>
<script type="text/javascript">
//-----------------
function Swap( id_){
  var Obj= document.getElementById( id_);
  if( Obj){
    if( Obj.style.display == "none")
    Obj.style.display = ""
  else
    Obj.style.display = "none";
  }
}
</script>
</head>
<body>
<div id="D_MAIN" onclick="Swap('D_1');">
Cache
<div id="D_1">
Ligne 1
<br>Ligne 2
<br>Ligne 3
</div>
<body>
</html>
...
;O)

vendredi 1 février 2008 à 15:59:08 | Re : Cacher/Montrer

PetoleTeam

Membre Club
Croisement mais si ça baigne tant mieux...
;O)

vendredi 1 février 2008 à 16:08:20 | Re : Cacher/Montrer

keket

merci pour ton script. Mais le problème c'est qu'il ne marche pas sous IE 7 ... sniff sniff. dommage.

vendredi 1 février 2008 à 16:53:01 | Re : Cacher/Montrer

PetoleTeam

Membre Club
Je n'ai pas IE7,
je viens de me rendre compte qu'il manque un </div> pour fermer <div id="D_MAIN"> avant la balise </body>, peut être est cela ?
;O)

vendredi 1 février 2008 à 20:06:03 | Re : Cacher/Montrer

keket

le tien est bon avec le div sous IE 7 mais l'autre que j'ai trouver qui provient de toi aussi, (je crois) ne marche pas sous IE 7. dommage car il était pas mal !!!


1 2

Cette discussion est classé dans : site, cacher, click, montrer


Répondre à ce message

Sujets en rapport avec ce message

Cacher la base de donnée d'un site [ par virtuelkiller ] ViRtUeL KiLLeRAhhhhhhhhhhhh..... La base de donnée d'un site, vous savez c'est quand quelqu'un va sur votre site va sur une page et met un slash ou en simuler un click sur popup [ par leplaneur ] Bonjour,J'essai de faire une regression test en javascript sur un site web et j'ai besoin de simuler un click sur un  pop up de type confirm("Votre me fonction de enable [ par azstar ] je cherche une fonction qui sert a ecrire dans la même page plus tôt  aficher qlq chose qu'a étè cacher comme exemple lorsque vous click sur le menu q Montrer cacher des boites [ par simo14 ] Bonjour,A partir d'une fonction Javascript qui me permet de montrer et cacher une boite(une table) avec un bouton, je voudrais créer plusieurs boites Afficher des emails cacher sur un site [ par Airmouss ] Bonjour, Avant, tout d'abord je me présente Airmouss 23 ans de Montpellier 34 dans le languedoc roussillon le plus belle région de France quoi lol .  réactualiser le chargement automatiquement d'une page [ par alain63720 ] Bonjour, je suis nouveau pour créer des sites. J'ai créé comme j'ai pu un site pour une asso (http://alc;chateaugay.free.fr) en copian entre autre des Lien direct vers une modal dans un site [ par bouticheval ] Bonjour à tous, la question que je me pose n'est pas très simple alors je vais essayer d'être le plus clair possible:Je conçois un site vitrine qui fo transfert script dans une iframe [ par brunochp ] Bonsoir, j'ai un script php dans une iframe sur un site joomla (c'était la seule manière de mettre mon script)http://ncbc.immobilweb.frLe pb c que le problème javascript void(0) [ par manne1173 ] Bonjour,Je joue régulièrement sur un site de jeu en ligne qui est Equideow, un site de jeu de chevaux.Seulement voilà, depuis un peu plus d'une semain Récupérer du texte d'un autre site [ par stefman78260 ] Bonjour, je voulais savoir comment on peut faire pour récupérer un texte (un bout de texte) d'un site, et le faire afficher sur le miens, pour que qua


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :

Comparez les prix Nouvelle version

Photothèque Nouveau !



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,421 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.