Selamat pagi sahabat blogger, Kali ini saya akan memberikan sebuah trik blog yang berhubangan dengan Slide Show Foto, Slide Show Foto sendiri berbagai macam model slide show dapat saja tercipta berkat adanya JQuery. Mungkin anda sering melihat gambar atau foto yang ditampilkan dalam bentuk slide pada blog yang anda kunjungi. Ini tentu dapat memberikan daya tarik tersendiri bagi pengunjung web maupun blog.
- Cari code </head>.
- Masukkan Code Jquery dibawah ini tepat diatasnya code </head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
- Jika diblog anda sudah terpasng Code Jquery ini, maka jangan melakukan langkah di atas.
- Klik save template.
- Kemudian tambahkan gadget baru (Add new gadget).
- Pilih HTML/JavaScript.
- Copy dan paste Code dibawah ini kedalam gadget HTML/JavaScript.
<script src=" http://loramalunkblog.googlecode.com/files/codelora-malunk.blogspot.animation1.js.txt " type="text/javascript">
</script><script src="http://kodecode.googlecode.com/files/animation2.js" type="text/javascript"></script>
<script src="http://loramalunkblog.googlecode.com/files/lora-malunk.animation3.js" type="text/javascript">
</script><style type="text/css">
.amdhas { height: 232px; width: 432px; padding:0; margin:0; overflow: hidden; -webkit-box-shadow: 2px 2px 4px #000;-moz-box-shadow: 2px 2px 4px #000;-moz-border-radius: 10px; -webkit-border-radius: 10px;}.amdhas img { height: 200px; width: 400px; padding: 15px; border: 1px solid #ccc; background-color: #f8f8ff;-webkit-border-radius: 10px;-moz-border-radius: 10px;}</style><div class="amdhas" id="ke2">
<img height="200" src="URL GAMBAR DI SINI" width="400" />
<img height="200" src="URL GAMBAR DI SINI" width="400" />
<img height="200" src="URL GAMBAR DI SINI" width="400" /></div>
<script type="text/javascript">
$('#ke2').cycle({fx:'scrollDown',speedIn: 2000,speedOut: 500,easeIn:'bounceout',easeOut: 'backin',delay:-2000});
</script>
- Simpan atau Save dan lihat hasilnya.
Catatn Akhir :
Ukuran Gambar Foto dapat diatur dengan merubah angka yang berwarna merah (232, 432, 200, 400).
Author : coxelgokil | ACI BUDAYA
Anda telah membaca
artikel tentang : Cara Membuat Slide Show Foto Dengan Efek Jquery. Oleh Admin, Anda diperbolehkan mengcopy-paste atau menyebarluaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya. Terimakasih...