Skip to main content

Efek jQuery bagian 2

Efek jQuery bagian 2


Setelah kemarin kita membahas mengenai efek jQuery bagian 1, pada kesempatan kali ini kita melanjutkan ke efek jQuery bagian 2. Sebelum melanjutkan ke pokok pembahasan, bagi yang belum mengikuti mengenai pembelajaran mengenai jQuery bisa kalian buka melalui tautan di bawah ini iya teman teman.

Pembahasan menngenai jQuery

  1. Apa itu jQuery
  2. Apa itu jQuery Selector
  3. Efek jQuery bagian 1
  4. Efek jQuery bagian 2
Oke tanpa berlama-lama lagi mari kita langsung saja ke topik pembahasan pada artikel ini yaitu Efek jQuery bagian 2. Ayoo kita belajar bersama sama, apa bila ada kesalahan bisa saling mengingatkan satu sama lainnya.


jQuery animated() Effect

jQuery animated() effect ini berfungsi untuk mengubah suatu elemen dari satu keadaan ke keadaan yang lainnya. Keadaan yang diubah ini berdasarkan css. Nilai dari properti css yang berubah secara berangsur-angsur, hal ini untuk menciptakan sebuah efek animasi. Nilai properti css yang bisa diubah adalah nilai bertipe angka, baik satuannya pixel atau persen, untuk yang bertipe string tidak bisa di animasikan.

Sintak dari jQuery animated ini 

$(selector).animate(styles,speed,easing,callback)


Keterangan

  • styles : Bersifat wajib, digunakan untuk menentukan properti css yang akan dianimasikan. Dibawah ini merupakan properti dari css yang dapat dianimasikan.
    • backgroundPossition
    • borderWidth
    • borderBottomWidth
    • borderLeftWidth
    • borderRightWidth
    • borderTopWidth
    • borderSpacing
    • margin
    • marginBottom
    • marginLeft
    • marginRight
    • marginTop
    • outlineWidth
    • padding
    • paddingBottom
    • paddingLeft
    • paddingRight
    • paddingTop
    • height
    • width
    • maxHeight
    • maxWidth
    • minHeight
    • minWidth
    • font
    • fontSize
    • bottom
    • right
    • left
    • top
    • letterSpacing
    • wordSpacing
    • lineHeight
    • textInden
  • speed : Bersifat opsional, menentukan kecepaatan elemen muncul dari hidden ke visible. Dengan defaultnya adalah 0, nilainya bisa berupa :
    • millisecond (contoh : 1500)
    • slow
    • normal
    • fast
  • easing : Bersifat opsional, berfungsi untuk menentukan fungsi easing yang di set pada speed animasi. Built in dari fungsi easing :
    • swing
    • liniear
  • callback : Bersifat opsional, merupakan suatu fungsi yang akan dijalankan apabila efek slow telah selesai di jalankan.


$(selector).delay()

$(selector).delay() ini berguna untuk men-set delay untuk semua fungsi yang masih ngantri untuk elemen yang dipilih. Sintak dari $(selector).delay() adalah sebagai berikut 

$(selector).delay()


$(selector).dequeue()

$(selector).dequeue() ini berguna untuk men-set delay untuk menjalankan fungsi berikutnya yang lagi ngantri untuk elemen yang di pilih. Sintak dari $(selector).dequeue() adalah sebagai berikut 

$(selector).dequeue()


$(selector).queue()

$(selector).queue() ini berguna untuk menampilkan fungsi yang ngantri untuk elemen terpilih. Sintak dari $(selector).delay() adalah sebagai berikut 

$(selector).queue()


jQuery cleanQueue() Effect

jQuery cleanQueue() Effect ini berguna untuk menghentikan semua fungsi yang lagi ngantri dan belum dijalankan. Sintak dari jquery cleanQueue() adalah sebagai berikut 

$(selector).stop(queueName)



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 ...



Labels:
Location: Indonesia

Comments

Post a Comment

Artikel Populer

Cara Mendaftar Hosting Gratis di InfinityFree

Nah, pada kesempatan kali ini saya akan mengajari cara mendaftar Hosting Gratis di InfinityFree. Tapi sebelumnya saya akan menjelaskan terlebih dahulu secara singkat apa itu InfinityFree. InfinityFree adalah sebuah website hosting yang memberikan Unlimited Disk Space dan Unlimited Bandwidth.  Infinityfree.net  adalah sebuah layanan hosting yang disponsori oleh iFastNet yang memiliki dua layanan yaitu berbayar (Premium) dan Gratis (free). InfinityFree juga menyediakan berbagai layanan fitur-fitur untuk layanan hosting gratis, yaitu : Hosting gratis dan cepat 99,9% Up Time Hosting tanpa batas Hosting sepenuhnya gratis Tidak ada iklan paksaan Host domain apa saja Fitur Web Hosting Infinity Free: Unlimited Disk Space Unlimited Bandwidth 10 Email Accounts 400 MySQL Databases PHP 5.4, 5.5, 5.6, 7.0 MySQL 5.6 Apache 2.4 with .htaccess Linux 3.2 Free Subdomain Name Free SSL on all websites Free Cloudflare CDN Free DNS Service Nah, setelah mengetahui sedikit mengenai apa itu IfinityFre...
9 comments
Read more »

Tutorial Membuat HTML Sederhana

Apa itu HTML HTML merupakan sebuah kepanjangan dari Hyper Text Markup Language. HTML juga dapat diartikan sebagai suatu file teks sederhana yang mengandung perintah-perintah berupa TAG sehingga sebuah web browser dapat menampilkan suatu halaman dengan display tertentu. Nah disini saya akan mencontohkan tutorial tentang cara untuk membuat sebuah html sederhana untuk pemua sebagai bahan belajar bersama sama. Cara Membuat html Sederhana 1. pertama kalian buka dulu teks editor kalian seperti Sublime Teks, Visual Studio Code, dll. tapi disini saya  menggunakan Visual Studio Code. 2. setelah itu langsung buat File baru 3. Kemudian Pilin Plant Teks  ==> Pilih HTML 4. Lalu ketikan html seperti gambar di bawah ini untuk menampilkan sebuah tulisan Hello Word ! di browser. <! DOCTYPE html > < html >     < head >       < title >Langkah Awal</ title >     < head >     < body >      ...
6 comments
Read more »

Tutorial Cara lengkap Membuat Penomoran Halaman otomatis di Ms Word 2022

        Meskipun sering digunakan, namun masih banyak pengguna Microsoft Word yang belum memahami cara membuat halaman di Word. Padahal, cara ini dibutuhkan untuk berbagai keperluan, mulai dari membuat skripsi, jurnal, laporan, atau tugas sekolah biasa.           Adanya nomor halaman memudahkan siapa saja bagi yang ingin melihat tulisan yang dituju. Namun, tak jarang salah satu kendala yang di hadapi adalah bingung membuat nomor di word.         Sebagian orang ada yang membuat file dokumen terpisah di setiap format halaman tersebut. Bahkan, membuat nomor halaman berbeda secara manual. Padahal, Anda bisa membuat halaman tanpa manual karena dengan fitur otomatis. Lalu, bagaimana cara membuat nomor halaman di Microsoft Word secara otomatis? Berikut langkah-langkahnya : Cara membuat nomor halaman secara otomatis di Microsoft Word 1. Buka aplikasi Microsoft Word dan pilih menu Insert . 2. Klik opsi Page Nu...
4 comments
Read more »

Belajar HTML Dasar #6 - Membuat Tabel Pada HTML

Membuat Tabel Pada HTML Tabel merupakan struktur yang digunakan untuk nmenampilkan informasi dalam bentuk baris dan kolom. Pada html, untuk pembuatan tabel menggunakan tag <table> dan menggunakan tag <tr>   untuk membuat baris dan <td> untuk membuat kolom. Untuk lebih mudah dalam memahami pembuatan table pada html, berikut ini akan saya sajikan penjelasan tag yang terlibat dalam pembuatan table pada HTML. Tag <table> merupakan tag pembuka dalam pembuatan sebuah table pada html, tanpa tag <table>   ini, penggunaan <tr> dan <td> tidak bisa digunakan dengan baik. < tr> atau dikenal dengan table row merupakan tag yang digunakan untuk membuat baris dalam table html. <td> atau dikenak dengan tabel data merupakan tag yang digunakan untuk membuat kolom  dalam baris dan tag < th> untuk membuat tablehead atau bagian kepala pada table. Dibawah ini adalah contoh pembuatan table pada HTML berikut : <! DOCTYPE ht...
Post a Comment
Read more »