Kaedah slideToggle dalam jQuery
Kaedah seterusnya -
slideToggle
berfungsi seperti berikut: jika elemen disembunyikan - ia akan memaparkan
elemen tersebut, dan jika ditunjukkan - ia akan menyembunyikannya. Kemudahan
kaedah ini ialah semuanya boleh diletakkan pada satu butang,
dan bukan dua, seperti dalam
pelajaran sebelumnya.
Mari kita lihat contoh berikut. Katakan kod HTML kami kelihatan seperti ini:
<button id="toggle">click me</button>
<div id="elem">text...</div>
Juga terdapat CSS:
#elem {
padding: 10px;
width: 150px;
height: 150px;
border: 1px solid green;
margin-top: 10px;
}
Sekarang tulis kod, supaya dengan mengklik satu butang, elemen sama ada disembunyikan atau dipaparkan:
$('#toggle').click(function() {
$('#elem').slideToggle(1000);
});