Metoda slideToggle v jQuery

Další metoda - slideToggle funguje takto: pokud je prvek skrytý - zobrazí ho, a pokud je zobrazený - skryje ho. Výhoda této metody spočívá v tom, že to vše lze pověsit na jedno tlačítko, a ne na dvě, jako tomu bylo v předchozích lekcích.

Podívejme se na následující příklad. Nechť náš HTML kód vypadá takto:

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

Také je zde CSS:

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

Nyní napíšeme kód, aby se po kliknutí na jedno tlačítko prvek skrýval a zobrazoval:

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