Bagaimana menggunakan jQuery?
- Download library jQuery langsung dari websitenya, Di http://jquery.com . Pilih versi jQuery yang diinginkan.
- Simpan file jquery, misalnya di D:\latihan. Lalu buat dokumen baru (*.html) yang isinya sebagai berikut:
< head >< title >Latihan jQuerytitle > |
- Selanjutnya kita panggil library jQuery diantara tag head.
< head >< title >Latihan jQuerytitle > |
< script type = "text/javascript" src = "jquery-1.4.js" >script > |
- Sebagai contoh, kita akan membuat dua buah tombol yang akan mengontrol sebuah gambar, berikut contoh skripnya:
< head >< title >Latihan jQuerytitle > |
< script type = "text/javascript" src = "jquery-1.4.js" >script > |
< button class = "semmbunyi" >Sembunyikanbutton > |
< button class = "tampil" >Tampilkanbutton > |
< p >< img id = "foto" src = "fotomu.jpg" >p > |
- Kemudian buat skrip jQuery dan sesuaikan dengan id atau class yang telah kita definisikan pada langkah sebelumnya, berikut contoh skripnya:
< head >< title >Latihan jQuerytitle > |
< script type = "text/javascript" src = "jquery-1.4.js" >script > |
< script type = "text/javascript" > |
$(document).ready(function(){ |
$(".sembunyi").click(function(){ |
$.("#foto").hide("slow"); |
$(".tampil").click(function(){ |
$.("#foto").show("slow"); |
< button class = "semmbunyi" >Sembunyikanbutton > |
< button class = "tampil" >Tampilkanbutton > |
< p >< img id = "foto" src = "fotomu.jpg" >p > |
- Lalu simpan filenya dengan nama japarus.html. Untuk melihat hasilnya, tinggal dobel-klik saja pada filenya, maka akan dibuka pada browser default kita, Atau Klik Kanan Open with firefox
Lihat Hasil nya ..
Selamat Menoba ..
Tidak ada komentar:
Posting Komentar