w3tutoriels.com

jQuery toggle()

La méthode toggle() de jQuery est un type de méthode spécial qui permet de basculer entre les méthodes hide() et show(). Il montre les éléments cachés et cache l’élément montré.

Syntaxe:

$(selector).toggle();  
$(selector).toggle(speed, callback);  
$(selector).toggle(speed, easing, callback);  
$(selector).toggle(display);

Prenons un exemple pour voir l’effet toggle() de jQuery.

<!DOCTYPE html>  
<html>  
<head>  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>  
<script>  
$(document).ready(function(){  
    $("button").click(function(){  
        $("div.d1").toggle();  
    });  
});  
</script>  
</head>  
<body>  
<button>Basculer</button>  
<div class="d1" style="border:1px solid black;padding:10px;width:250px">  
<p><b>Titre </b><br/>    
Bonjour<br/>    
w3tutoriels.com<br/>    
site de programmation<br/>    
et d apprentissage<br/>    
</p>   
</div>  
</body>  
</html>  

Résultat :

Effet de toggle() avec paramètre de vitesse

Voyons l’exemple de l’effet de toggle() de jQuery avec une vitesse de 1500 millisecondes.

$(document).ready(function(){  
     $("button").click(function(){  
        $("div.d1").toggle(1500);  
    });  
});

 

 

Quitter la version mobile