Bagaimana Membuat Efek Loading / 'Memuat' dalam Blogspot Blogger?
Dari tetangga sebelah sob,sekalian mo promosi blog sahabat di
Saat sobat membuka halaman atau mengklik link posting misalnya akan ada efek menunggu atau istilahnya dengan 'animation loading page widget'.
Jadi sambil sobat menunggu konten blog tampil sempurna,widget ini akan tampil dengan gambar animasi yang telah disediakan dalam script.
Seperti yang telah
1.Script dengan ekstention
2.Gambar yang akan tampil,disini adalah yang berformat
Tampilan akan seperti ini (gambar ini akan tampil jika yang bersangkutan masih mengabadikannya pent-):
AkuPunya.Com,script ini sengaja kami ambil untuk sekedar berbagi trik dan tips membuat efek loading di blog.Saat sobat membuka halaman atau mengklik link posting misalnya akan ada efek menunggu atau istilahnya dengan 'animation loading page widget'.
Jadi sambil sobat menunggu konten blog tampil sempurna,widget ini akan tampil dengan gambar animasi yang telah disediakan dalam script.
Seperti yang telah
AkuPunya.Com ciptakan,berikut bahan yang dibutuhkan:1.Script dengan ekstention
*.js,silakan lihat di:http://tc.comze.com/js/preloadpage.js2.Gambar yang akan tampil,disini adalah yang berformat
*.gif yang beralamat di:http://lh3.googleusercontent.com/-kcn5J_HBL0k/TjwQzEsyEAI/AAAAAAAAAcw/fyuDdV9NDmU/ajax-loader.gifTampilan akan seperti ini (gambar ini akan tampil jika yang bersangkutan masih mengabadikannya pent-):
3.Langkah dan caranya.
Langkah dan Cara Membuat Efek Loading Blog dari AkuPunya.Com
Pertama,pilih Dashboard lalu pilih Templates kemudian pilih tab Edit HTML,selanjutnya cari kode<head> (Gunakan Ctrl+F),setelah ketemu sob,tepat dibawahnya letakkan kode berikut:
<script src='http://tc.comze.com/js/preloadpage.js' type='text/javascript'/>
Setelah itu,cari lagi kode
<body>,setelah ketemu hapus kode tersebut dan ganti dengan kode ini:
<body onLoad='PreloadPage();'>
<div id='prepage' style='position: fixed; _position: absolute; top: 0px; right: 0px; clip: inherit; _top: expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-offsetHeight); _left: expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth-offsetWidth); width: 100%; height: 100%; background-color: #000; padding: 0px; border: 0px; text-align: center; filter: alpha(opacity=75); -moz-opacity: .75; opacity: .75; font-family: verdana; font-weight: bold; color: #ccc;'>
<script type='text/javascript'>PreLoading();</script>
</div>
Simpan dan lihat hasilnya :D
No comments:
Post a Comment