Méthode fadeToggle dans jQuery

La méthode fadeToggle fonctionne de manière analogue à la méthode slideToggle, elle implémente aussi une alternance d'effets : tantôt elle affiche l'élément, tantôt elle le cache.

Par exemple, nous pouvons, en cliquant sur le même bouton, afficher et masquer un élément. Implémentons cette méthode sur le code HTML suivant :

html<button id="toggle">click me</button>
<div id="elem">text...</div>

Supposons que le CSS ressemble à ceci :

css#elem {
  padding: 10px;
  width: 150px;
  height: 150px;
  border: 1px solid green;
  margin-top: 10px;
}

Rédigeons le code Javascript suivant :

javascript$('#toggle').click(function() {
  $('#elem').fadeToggle(1000);
});