Cara Membuat Efek Loading Seperti Kang Ismet - Efek loading yang seperti ini akhir akhir ini banyak sekali di cari oleh para Redesigner blogger, ane gk tau kenapa, apa mungkin ini keren ya.
saya gk taulah. :D
Karena banyak yang minta, kali ini saya akan Share Tutorialnya. oke langsung saja ya
How To Make Loading Effect Like Kang Ismet
- Masuk dulu ke Blogger
- Pilih Template > Edit HTML
- Taruh Kode Dibawah ini diatas kode </style> atau ]]></b:skin>
#page-loader {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:999999;
background: #303030 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib6CUKw3na0Zo5KFuAnGVIXlQXGB7Kno9-3_is5Kg2pL5SQ-LSCB4ebxRe_fqXG0FlaTS34siHgTrtOZJN0oRLzwA_G8sdxUQFOwhYzNSc2T4GfvdW5TD-NMnRvqit96_GrSYZlxPLTyw/s200/load6.gif") no-repeat 50% 50%;
padding:1em 1.2em;
display:none
}
- Masukkan kode dibawah ini diatas kode </head>
<script src='https:
Kalo Jquery sudah ada di blog agan, langkah ini dilewati saja
- Masukkan kode dibawah ini diatas kode </body>
<script type='text/javascript'>
//<![CDATA[
// Menyisipkan markup tabir animasi
$(document.body).append('<div id="page-loader"></div>');
// Saat halaman aktif terpicu untuk berpindah/keluar menuju halaman lain...
$(window).on("beforeunload", function() {
// ... tampilkan tabir animasi dengan efek `.fadeIn()`
$('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
- Yang terakhir Save template
Terimakasih