Comment Faire apparaître...

Fermé
FactisGame Messages postés 9 Date d'inscription vendredi 21 septembre 2012 Statut Membre Dernière intervention 26 juin 2014 - 31 août 2013 à 18:13
SweetRiver Messages postés 102 Date d'inscription jeudi 4 août 2011 Statut Membre Dernière intervention 22 novembre 2016 - 22 déc. 2013 à 13:25
Bonjour,

J'aimerai savoir comment faire en sorte qu'une <div> n'apparaisse qu'à un certain moment. Explication :

J'aimerais qu'un menu de navigation s'affiche sur ma page uniquement lorsque le menu de navigation présent dans le header disparaît

1 réponse

SweetRiver Messages postés 102 Date d'inscription jeudi 4 août 2011 Statut Membre Dernière intervention 22 novembre 2016 6
2 sept. 2013 à 17:44
Bonjour,

Il faudrait plus d'infos.

Par exemple, quand tu dis 'disparait', cela peut être différentes choses:
- visibility:hidden;
- display:none;
- décalage sur un axe de sorte qu'on ne le voit plus
- non visible dans la fenêtre, car il y a un défilement de la page

Si tu as un lien à fournir, ce serait encore plus pratique.

@+
0
FactisGame Messages postés 9 Date d'inscription vendredi 21 septembre 2012 Statut Membre Dernière intervention 26 juin 2014
2 sept. 2013 à 21:20
Site de test : http://factisgame.byethost6.com/FactisSite/
Vois-tu en haut à droite il y a un menu et sur la gauche il y a un autre menu qui reste présent lorsque tu descend plus bas dans la page. j'aimerai que lorsque le menu en haut à droite et visible, le menu de gauche soit invisible et à contrario quand le menu en haut à droite n'est plus visible celui à gauche apparaît
0
SweetRiver Messages postés 102 Date d'inscription jeudi 4 août 2011 Statut Membre Dernière intervention 22 novembre 2016 6
2 sept. 2013 à 22:44
OK.

1) CSS :
Tu ajoutes une ligne afin de ne pas afficher le menu de gauche par défaut :
ul.nav{
        list-style:none;
        padding:0;
        margin:0;
        position:fixed;
        left:-30px;
        top:140px;
        display:none; // ICI
}

2) HTML :
Tu insères ce "petit" bout de code :
<script type="text/javascript">
function menuMng() {
   var menuTop=jQuery('.wa-button'),
       menuLeft=jQuery('ul.nav'),
       topMT=menuTop.offset().top,
       pageTop=jQuery(window).scrollTop(),
       bottomMT=topMT+menuTop.height();
   if (bottomMT < pageTop) {menuLeft.css({display:'block'})}
         else {menuLeft.css({display:'none'})};
}
function menuSwitch(){setInterval("menuMng()",50)}
window.onload=menuSwitch;
</script>

Essaie, cela devrait répondre à tes attentes.

@+
0
salim_1305 Messages postés 60 Date d'inscription lundi 18 novembre 2013 Statut Membre Dernière intervention 7 novembre 2018 1
5 déc. 2013 à 15:24
ça marche
0
SweetRiver Messages postés 102 Date d'inscription jeudi 4 août 2011 Statut Membre Dernière intervention 22 novembre 2016 6
22 déc. 2013 à 13:25
Tant mieux, et bonnes fêtes !

@+
0