Efek jQuery - Geser
Metode slide jQuery menggeser elemen ke atas dan ke bawah.
Klik untuk menggeser ke bawah/atas panel
Karena waktu sangat berharga, kami memberikan pembelajaran yang cepat dan mudah.
Di W3Schools, Anda dapat mempelajari semua yang perlu dipelajari, dalam format yang mudah diakses dan praktis.
Contoh
Mendemonstrasikan metode jQuery slideDown().
Mendemonstrasikan metode jQuery slideUp().
Mendemonstrasikan metode jQuery slideToggle().
Metode Geser jQuery
Dengan jQuery Anda dapat membuat efek geser pada elemen.
jQuery memiliki metode slide berikut:
slideDown()slideUp()slideToggle()
jQuery slideDown() Metode
Metode jQuery slideDown()digunakan untuk menggeser elemen ke bawah.
Sintaksis:
$(selector).slideDown(speed,callback);
Parameter kecepatan opsional menentukan durasi efek. Itu dapat mengambil nilai-nilai berikut: "lambat", "cepat", atau milidetik.
Parameter callback opsional adalah fungsi yang akan dijalankan setelah penggeseran selesai.
Contoh berikut menunjukkan slideDown()metode:
Contoh
$("#flip").click(function(){
$("#panel").slideDown();
});
jQuery slideUp() Metode
Metode jQuery slideUp()digunakan untuk menggeser elemen ke atas.
Sintaksis:
$(selector).slideUp(speed,callback);
Parameter kecepatan opsional menentukan durasi efek. Itu dapat mengambil nilai-nilai berikut: "lambat", "cepat", atau milidetik.
Parameter callback opsional adalah fungsi yang akan dijalankan setelah penggeseran selesai.
Contoh berikut menunjukkan slideUp()metode:
Contoh
$("#flip").click(function(){
$("#panel").slideUp();
});
jQuery slideToggle() Metode
Metode jQuery slideToggle()beralih antara metode slideDown()dan slideUp()
.
Jika elemen telah meluncur ke bawah, slideToggle()akan menggesernya ke atas.
Jika elemen telah digeser ke atas, slideToggle()akan digeser ke bawah.
$(selector).slideToggle(speed,callback);
Parameter kecepatan opsional dapat mengambil nilai berikut: "lambat", "cepat", milidetik.
Parameter callback opsional adalah fungsi yang akan dijalankan setelah penggeseran selesai.
Contoh berikut menunjukkan slideToggle()metode:
Contoh
$("#flip").click(function(){
$("#panel").slideToggle();
});
Latihan jQuery
Referensi Efek jQuery
Untuk gambaran lengkap semua efek jQuery, silakan kunjungi Referensi Efek jQuery kami .