Membuat website Super Canggih dengan jQuery
Rabu, 24 Juli 2013
0
komentar
Membuat website Super Canggih dengan jQuery. Kalau Fungsi dari jQuery itu sendiri adalah menyederhanakan kode javascript, Plugin jQuery berfungsi menyederhanakan code jQuery itu sendiri. karena itu dengan plugin jQuery akan jauh lebih simple dan ringkan dalam penulisan javascript.
Cara menggunakan plugin jQuery hampir sama menggunakan jQuery biasa, misalnya pada jQuery Circle plugin untuk membuat sebuah image slideshow seperti dibawah ini
1. Panggil Library jquery plugin dengantag <head> pada file html :
<html>
<head>
<script type="text/javascript' src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src"jquery.cyrcle.all.win.js"></script>
</head>
<body>
</body>
</html>
2. Buat contentnya seperti dibawah ini :
<html>
<head>
<script type="text/javascript' src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src"jquery.cyrcle.all.win.js"></script>
</head>
<body>
<div class="slideshow">
<img src="beach1.jpg" width="200" height="200" />
<img src="beach2.jpg" width="200" height="200" />
<img src="beach3.jpg" width="200" height="200" />
<img src="beach4.jpg" width="200" height="200" />
<img src="beach5.jpg" width="200" height="200" />
</div>
</body>
</html>3. Panggil methode jquery plugin dan atur parameternya jika ada. hasilnya nanti akan terlihat pada pembahasan berikutnya yaitu Image Slideshow.
<html>
<head>
<script type="text/javascript' src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src"jquery.cyrcle.all.win.js"></script>
<script type="text/javascript">
$ (document) .ready(function() {
$ ('.slideshow') .cyrcle({
fx: 'fade'
});
});
</script>
</head>
<body>
<div class="slideshow">
<img src="beach1.jpg" width="200" height="200" />
<img src="beach2.jpg" width="200" height="200" />
<img src="beach3.jpg" width="200" height="200" />
<img src="beach4.jpg" width="200" height="200" />
<img src="beach5.jpg" width="200" height="200" />
</div>
</body>
</html>Begitu sederhana kita bisa membuat image slideshow dengan plugin jquery. jika kita menggunakan jquery biasa pasti jauh lebih rumit dibandingkan menggunakan plugin. apalagi jika mengguanakn javascript biasa atau standart.
Untuk selanjutnya postingan saya bagaimana membuat Menu Dropdown
nantikan postingan saya berikutnya.
Terbaru
Untuk sobat semua yang mencari Traffic secara gratis dan sangat cocok
untuk website dan Blogspot /wordpress yang sobat miliki.
silahkan
download software Auto Traffic AlexaMaster dan joint gratis, Dapatkan
1000 visitor gratis jika sobat surf silent pada sistem .
Baca Selengkapnya ....
Categories:
