Ajout d'une instruction IF à jquery

J'essaie d'ajouter un effet de glissement pour afficher un div caché lorsque je clique sur une image et lorsque je clique sur la même image lorsque la div est visible, je voudrais la faire glisser et faire le contenu caché à nouveau.Ajout d'une instruction IF à jquery

C'est le script je travaille avec:

<script> 
$(document).ready(function(){ 

    $("button").click(function(){ 
     $(".content").slideUp(); 
    }); 
    $("button").click(function(){ 
     $(".content").slideDown(); 
    }); 
}); 
</script> 

.content{ 
    display: none; 
} 

<body> 
     <button><img src="image.jpg"/></button> 
     <div class="content"> 
     stuff here 
     </div> 
</body>

Je voudrais avoir une teneur IF est visible que slideUp() autre slideDown() Je suis tout simplement de la difficulté à ajouter au script existant.

Source

2017-04-17 Zachary

Profitez de la méthode .slideToggle() jQuery http://api.jquery.com/slidetoggle/

$(document).ready(function(){ 

    $("button").click(function(){ 
     $(".content").slideToggle(); 
    }); 
});

EDIT: Pour créer la correspondance entre les boutons et le contenu qu'ils BASCULEMENT, utilisez la méthode .next() jQuery pour sélectionner le contenu approprié.

$(document).ready(function(){ 

    $("button").click(function(){ 
     // gets the button's immediate next sibling, 
     // which is the '.content' div (according to your html) 
     $(this).next().slideToggle(); 
    }); 
});

Source

2017-04-17 16:42:33 SteamDev

Cela a fonctionné très bien mais j'ai 3 images que je voudrais basculer le contenu. Quand j'ouvre le premier et que j'en ouvre un autre, y a-t-il un moyen de fermer le premier? – Zachary

Ajout d'une instruction IF à jquery

Répondre

Questions connexes