Hai teman-teman semuanya, kembali lagi pada tutorial dumet school, seperti yang sudah kita pelajari mengenai jquery, kita telah banyak membahas method, event dan efek-efek yang ada pada jquery, pada kesempatan kali ini kita masih akan belajar salah satu method yang ada pada jquery yaitu toggleclass(), dan pada tutorial kali ini kita akan mengenal lebih jauh tentang toggleclass() pada jquery.

Apa itu method toggleclass()?  fungsi dari method yang satu ini adalah cara yang lebih praktis karena dengan method ini kita dapat membuat 2 fungsi dalam satu tombol, mungkin untuk lebih jelasnya kita langsung saja praktekan, teman-teman silahkan buat sebuah file dan ketikan script berikut ini:

Script diatas saya membuat 3 buah text dengan element yang berbeda, lalu saya membuat satu buah tombol, nanti konsepnya ketika kita klik maka semua tulisan akan berubah warna namun tidak menggunakan fungsi addclass tapi kita menggunakan fungsi toggleclass(),

Oke jika sudah teman-teman coba tambahkan script berikut ini:

script diatas adalah cssnya, dimana nanti class biru yang akan kita gunakan,

lalu sekarang teman-teman tambahkan script berikut ini:

pertaman saya memanggil library dari jquery yang saya ambil dari jquery.com, lalu saya  membuat fungsi click pada tag button dimana ketika button ini diklik, element h1,h2 dan p akan terkena efek toggleclass blue yang artinya akan berubah warna,

Jika teman-teman save, maka hasilnya jika teman-teman klik tombol maka text tersebut akan berubah warna menjadi biru,

Nah perbedaannya dengan fungsi addclass adalah, toggleclass disini dapat kita klik lagi sehingga element yang bersangkutan akan kembali berubah seperti belum terkena efek toggleclass,

Gimana teman-teman? cukup mudah bukan, saya rasa untuk tutorial kali ini tentang mengenal lebih jauh tentang toggleclass() pada jquery cukup sampai disini dulu, sampai bertemu lagi pada tutorial berikutnya,

terima kasih.