De slideToggle-methode in jQuery
De volgende methode -
slideToggle
werkt als volgt: als een element verborgen is - toont het het,
en als het getoond is - verbergt het het. Het gemak
van deze methode is dat dit allemaal op één knop kan worden gezet,
in plaats van op twee, zoals het was in de
vorige lessen.
Laten we het volgende voorbeeld bekijken. Stel dat onze HTML-code er als volgt uitziet:
<button id="toggle">click me</button>
<div id="elem">text...</div>
Er is ook CSS:
#elem {
padding: 10px;
width: 150px;
height: 150px;
border: 1px solid green;
margin-top: 10px;
}
Laten we nu code schrijven, zodat bij een klik op één knop het element zich verbergt en toont:
$('#toggle').click(function() {
$('#elem').slideToggle(1000);
});