Mengenal Fungsi Effect dan Explode Effect jQuery UI

Halo teman – teman, selamat datang di situs tips dan trik Source Code Aplikasi. Kembali lagi dengan saya di pengenalan guna – guna jQuery, di kesempatan kali ini kita akan belajar Mengenal Fungsi Effect dan Explode Effect jQuery UI dimana guna ini dapat menghasilkan effect, bagi kategory guna effect sendiri mempunyai lingkup diantaranya ada guna .show(), hide() dan .toggle() ketiga guna ini dapat dinamakan ada pada kategori effect. Dan effect sendiri pun mempunyai hasil, nah berikutnya explode effect kita dapat gunakan pun di dalamnya.



Bagus, langkah berikutnya kita akan implementasikan Mengenal Fungsi Effect dan Explode Effect jQuery UI seperti biasanya  teman – teman siapkan text editornya. Dan copy script html seperti di bawah ini



<!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<title><strong>Mengenal Manfaat Effect dan Explode Effect jQuery UI</strong></title>
</head>
<body>
<button>Klik</button>
<div></div>
</body>
</html>


Dan save dengan nama index.html, langkah berikutnya kita tambahkan library nya terlebih dahulu



<link rel=stylesheet href=http://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css>
<script src=http://code.jquery.com/jquery-1.12.4.js></script>
<script src=http://code.jquery.com/ui/1.12.1/jquery-ui.js></script>


Kemudian masukkan css nya



<style><br> div {<br> width: 100px;<br> height: 100px;<br> background: #ccc;<br> border: 1px solid #000;<br> }<br> </style>


Baru kita masukkan script jQuery UI nya



<script><br>$( button ).click(function() {<br> $( div ).effect( bounce, slow);<br>});<br></script>


Bila telah save dan jalankan di browsernya, karenanya hasilnya seperti gambar di bawah ini



selamat



Kemudian teman – teman klik di button, karenanya hasilnya ialah kotak akan bergetar ke atas dan ke bawah yang di hasilkan oleh bounce kemudian kita gunakan explode effect 



<script>
$( button ).click(function() {
$( div ).effect( explode);
});
</script>


selamat



Bila telah save dan refresh di browser nya, lalu teman – teman klik di button, karenanya hasilnya kotak akan memudar dengan pecahan kotak yang di hasil dari guna explode effect. Inilah praktek singkat dengan studi case yang sederhana, teman – teman dapat pun di explor lagi jQuery UI nya supaya lebih terbiasa pada menggunakan guna – guna jQuery UI. Bagus saya rasa demikian dulu di artikel kali ini mengenai Mengenal Fungsi Effect dan Explode Effect jQuery UI kita berjumpa kembali di tips dan trik yang akan datang. Terimakasih dan hingga jumpa.



 




Sumber https://kursuswebsite.org

Popular posts from this blog

Perbedaan Antara Keyup dan Keydown Pada jQuery

Membuat Table Warna Berselang dengan PHP