Besoin d'aide activer/désactiver une fonction avec un seul bouto

Fermé
OhMyGoodness Messages postés 1 Date d'inscription dimanche 12 novembre 2017 Statut Membre Dernière intervention 12 novembre 2017 - Modifié le 12 nov. 2017 à 15:07
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 - 13 nov. 2017 à 16:08
Bonjour/Bonsoir,

J'aimerais vous poser une question, je n'arrive pas à désactiver une fonction en rappuyant sur le même bouton, comment faire ? Voici mon code:

<!--Menu-->
<div id="container">
  <div id="bar"></div>
  <div id="bar2"></div>
  <div id="bar3"></div>
</div>


/*Menu*/
#container{
 display: inline-block;
 cursor: pointer;
 right: 70px;
 top: 50px;
 position: absolute;
 z-index: 5;
}
#bar,#bar2, #bar3{
 width: 35px;
 height: 5px;
 background-color: #333;
 margin: 6px 0;
 transition: 0.4s;
 position: absolute;
}


#bar { top:0px;}
#bar2{}
#bar3{top: 15px;}


container.onclick =
function potatoes(){
  TweenMax.to(menu, 1, {top:0})
  TweenMax.to(bar, 0.4, {rotation:"-45deg", top:"15px", backgroundColor:"rgba(255, 255, 255, 1)"})
  TweenMax.to(bar2, 0.1, {opacity:0, backgroundColor:"rgba(255, 255, 255, 1)"})
  TweenMax.to(bar3, 0.4, {rotation:"45deg", backgroundColor:"rgba(255, 255, 255, 1)"})
  container2.style.zIndex = 5;
     container.style.zIndex = 4;
  };



EDIT : Ajout du LANGAGE dans les balises de code (la coloration syntaxique).

Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.
Jordane45


donc voila j'arrive à cliquer et le menu déroule de haut en bas mais je n'arrive pas le faire remonter quelqu'un à une petite idée de comment faire ? merci d'avance..

PS: j'utilise TweenMax pour les animation.
A voir également:

1 réponse

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
13 nov. 2017 à 16:08
Salut,

Un début de solution possible :
 <button onclick="myFunction()">Try it</button>

<div id="myDIV">
  This is a DIV element.
</div> 

<script>
function myFunction() {
    var element = document.getElementById("myDIV");
    element.classList.toggle("mystyle");
    
    if (element.classList.contains("mystyle")) {
        alert('ajouter animation');
    } else {
        alert('enlever animation');
    }
} 
</script>


Bonne journée,
0