Skip to main content

Efek jQuery bagian 1

 


Setelah kemaren kita sudah membahas mengenai apa itu jQuery dan jQuery selektor. Nah sekarang kita akan melanjutkan pembahasan menhenai jQuery yaitu tentang efek-efek yang ada di jQuery part 1. Tapi sebelum lanjut, apa bila ada yang belum paham mengenai apa itu jQuery bisa langsung saja kunjungi artikel saya yang sebelumnya yang membaahas apa itu jQuery.

Pembahasan menngenai jQuery

  1. Apa itu jQuery
  2. Apa itu jQuery Selector
  3. Efek jQuery bagian 1
  4. Efek jQuery bagian 2

Efek di jQuery

Salah satu dari kemampuan jQuery adalah adanya fungsi-fungsi efek yang sudah siap untuk di pakai. Biasanya untuk membuah efek memudar di javascript, kita harus membuat sebuah kode yang cukup panjang. Tetapi jika kita menggunakan jQuery kita cukup menggunakan fungsi $(selector).fadein(). Nah mungkin itu tadi salah satu contoh efek yang ada di jquery, dibawah ini adalah contoh efek-efek yang ada di jQuery yang sudai siap untuk kita pakai.


jQuery show() Effect

Efek jQuery show() ini sangat berguna untuk menampilkan elemen-element yang tersembunyi. Untuk mengatur element yang tersembunyi melalui CSS adalah display:none (bukan visibility:hidden). Untuk sintaknya sebagai berikut

$(selector).show(speed,callback)

Keterangan :

speed : Bersifat opsional, yaitu untuk menentukan kecepatan elemen muncul dari hidden ke visible. untuk defaultnya adalah 0, nilainya bisa berupa milllisecond, slow, normal, atau juga fast.

callback : Bersifat opsional, ini merupakan sebuah fungsi yang akan dijalankan apabila effek show selesai di jalankan

 

jQuery hide() Effect

jQuery hide() effeck ini berfungsi untuk menyembunyikan elemen yang dipilih. Untuk sintaknya adalah seperti berikut ini 

$(selector).hide(speed,callback)

Untuk keterangannya sama dengan show() effect, yang membedakan adalah fungsi dari hide. Dibawah ini adalah contoh penggunaan dari sintak jQuery hide() effect

$(".tombol1").click(function(){
    $("p").hide();
   });



jQuery toggle() Effect

jQuery toggle() effect ini merupakan sebuah gabungan dari fungsi hide dan show. jadi toggle() berfungsi untuk menampilkan sesuatu yang tersembunyi dan menyembunyikan yang tampak. Untuk sintaknya adalah sebagai berikut

$(selector).toggle(speed,callback,switch)

Keterangan :

speed : Bersifat opsional, yaitu untuk menentukan kecepatan elemen muncul dari hidden ke visible. untuk defaultnya adalah 0, nilainya bisa berupa milllisecond, slow, normal, atau juga fast.

callback : Bersifat opsional, ini merupakan sebuah fungsi yang akan dijalankan apabila effek show selesai di jalankan

switch : Bersifat opsional dan mempunyai nilai boolean yaitu TRUE or FALSE. Jika parameter ini di set, parameter speed dan callback parameters tidak bisa digunakan.

 

jQuery slideup() Effect

jQuery slideup() effeck ini berfungsi untuk menyembunyikan element secara efek sliding. sintak dari jQuery slideup() ini adalah 

$(selector).slideUp(speed,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show()


jQuery slideDown() Effect

jQuery slideDown effect berfungsi untuk menampilkan elemen yang tersembunyi secara efek sliding. untuk sintak dari JQuery slideDown ini adalah sebagai berikut 

$(selector).slideDown(speed,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show()


jQuery slideToggle() Effect

jQuery slideToggle() effect ini merupakan sebuah gabungan dari slideDown() dan slideUp(). ini berfungsi untuk menyembunyikan elemen jika dalam keadaan visible, menampilkan elemen jika dalam keadaan hidden. untuk sintaknya adalah sebagai berikut 

$(selector).slideToggle(speed,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show()


jQuery fadeIn() Effect

jQuery fadeIn() effect ini berfungsi untuk menampilkan elemen yang dipilih jika tersembunyi secara efek memudar. Sintak dari jQuery fadeIn() adalah sebagai berikut 

$(selector).fadeIn(speed,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show()


jQuery fadeOut() Effect

jQuery fadeOut() effect ini berfungsi untuk menyembunyikan elemen yang dipilih secara efek memudar. Sintak dari jQuery fadeOut() adalah sebagai berikut 

$(selector).fadeOut(speed,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show()


jQuery fadeTo() Effect

jQuery fadeTo() effect ini berfungsi untuk mengatur tingkat kepudaran elemen terpilih menuju tingkat opacity yang dituntukan. Sintak dari jQuery fadeTo() adalah sebagai berikut 

$(selector).fadeTo(speed,opacity,callback)

Untuk parameter speed dan callback adalah sama dengan fungsi show(). Sedangkan untuk parameter opacity bisa bernilai 0 sampai 1


jQuery stop() Effect

jQuery stop() effect ini berfungsi untuk menghentikan animasi yang sedang berjalan. Sintak dari jQuery stop() adalah sebagai berikut 

$(selector).stop(stopAll,goToEnd)

Keterangan :

stopAll : Bersifat opsional dan bernilai boolean, menentukan apakah menghentikan semua animasi termasuk yang ngantri untuk di jalankan pada elemen yang di pilih atau tidak.

goToEnd : Bersifat opsional dan bernilai boolean, menentukan apakah animasi yang sedang jalan dikompletkan atau tidak. Parameter ini hanya bisa digunakan jika parameter stopAll di set


Nah, mungkin sampai di sini dulu mengenai pembahasan efectpada jQuery bagian pertama. nantikan artikel selamjutnya yang membahas mengenai efect-efect pada jQuery bagian 2. Bila ada yang mau di tanyakan, silahkan bisa comment di bawah ya. Sekian dari saya, TerimaKasih ...



Comments

Artikel Populer

Pengertian CMS WordPress

Pada Artikel sebelumnnya kita sudah mempelajari apa itu CMS (Content Manajement Sistem) serta dengan contoh-contohnya sekaligus. Nah pada kesempatan kali ini mari kita bahas mengenai salah satu CMS yaitu WordPress. Apakah sudah ada yang tau apa itu WordPres?, bagaimana cara kerjanya?, yuuu kita cari tau bareng-bareng pada artikel kali ini. Daftar Belajar CMS ( Content Manajement System ) Pengertian CMS dan contohnya CMS WordPress Cara membuat CMS dst. Apa itu WordPress? WordPres adalah sebuah CMS (Content Management system) yang dapat membantu kita dalam membuat serta mengelola sebuah website tanpa menggunakan sebuah codingan. Dengan menggunakan wordpresskita bisa menata tampilan, menambah fitur-fitur, dan membuat sebuah konten website dengan mudah. WordPress diluncurkan oleh matt mullenweg dan mike little pada tahun 2004. WordPress merupakan sebuah CMS yang bisa kita gunakan secara gratis atau biasa kita sebut dengan open source. WordPress ada 2 macam, yaitu WordPress.org dan Wordpres...

HTML dan CSS - Pengertian, Sejarah, Fungsi, dan Jenis CSS

CSS merupakan kepanjangaan dari   Cascading Style Sheets  dimana css adalah salah satu bahasa pemprogaman yang digunakan oleh seorang programer untuk membuat sebuah website.  CSS digunakan oleh programer untuk mendesain halaman depan atau tampilan dari suatu website agar lebih memiliki variasi Mengapa harus CSS? Karena di CSS ada banyak hal yang dapat kita lakukan dibandingkan dengan bahasa pemrograman inti lainnya seperti HTML dan PHP. Ketika kita menggunakan CSS, kita dapat mengatur warna teks, jenis font, baris antar paragraf, ukuran kolom, dan jenis  background  yang dipakai sesuai kemauna diri kita sendiri. Tidak hanya itu, di CSS kita juga bisa untuk mendesain sebuah  layout , variasi tampilan di berbagai perangkat yang berbeda ( respondsive ), dan masih banyak yang lainnya. Makannya t idak heran jika psada saat ini CSS hampir dipakai di berbagai website untuk dikombinasikan dengan HTML maupun PHP. Apa itu CSS ? CSS sendiri merupakan singkatan dari...

Mengenal apa itu Framework

Paada artikel kali ini kita akan menbahas mengenak tentang Apa itu Framework? mulai dari pengertian framework, manfaat, macam-macam frame work, serta kelebihan dan kekurangannuya. Mari kita cari tau di sini.  Baca Juga : Analisis Sistem Informasi Apa itu Framework ? FRAMEWORK adalah sebuah kerangka kerja yang digunakan untuk mengembangkan sebuah website. Framework sendiri diciptakan untuk membantu web developer dalam menulis baris code, dengan menggunakan framework penulisan code akan jauh lebih mudah, cepat dan terstruktur rapi. atau dalam bahasa sederhananya framework itu merupakan alat bantu untuk menulis code agar lebih mudah cepat dan terstruktur sehingga bisa menghemat waktu. MANFAAT FRAMEWORK Framework juga memiliki banyak manfaat bagi para programer dalam membuat sebuah webbsite. Dibawah ini adalah merupakan manfaat dari mennunakan sebuah frame work yaitu : Dapat membantu kerja developer dalam membangun aplikasi sehingga aplikasi bias selesai dalam waktu yang singkat. Pener...

Download Driver Printer Canon Pixma Ip2770

  Silahkan Download file driver printer Canon Pixma Ip 2770   melalui link di bawah ini, semoga bisa bermanfaat buat kita semua. Jika ada yang mau ditanyakan atau ada kesusahan dalam proses install Visual Studionya. bisa langsung comment di bawah iyoo atau juga bisa melalui Contak Person . Link Download driver printer   Canon Pixma Ip 2770 iP2700 series Printer Driver Ver. 2.56c (Windows) (id.canon) Sekian Dan Terimakasih ....