Cara Memasang Flat Preloader di Blog
SnippetBagaimana cara memasang efek loading blogger ini? Untuk tutorial Cara Memasang Efek Animasi Page Loading di Blog bisa Anda terapkan dengan mudah, silakan ikuti langkah di bawah ini:
Pastikan sudah login ke Blogger, sekarang masuk ke dashboard blog sobat klik template dan pilih edit HTML, kemudian cari kode </body>, jika sudah ketemu, salin kode di bawah ini di atasnya.
<style type='text/css'>
#loading{
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#000 url('https://3.bp.blogspot.com/-sW166HTPK4U/UY2kVNdjsFI/AAAAAAAAEHk/fIO-B-mOeCE/s200/load6.gif') no-repeat 50% 30%;
display: none;
font: 0/0 a;
text-shadow: none;
padding: 1em 1.2em;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="loading">Loading...</div>');
$(window).on("beforeunload", function() {
// ... Show the Animation `.fadeIn()`
$('#loading').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
Perhatikan kode yang ditandai, bisa Anda ganti dengan url gambar lain. Silakan Anda cari referensi untuk gambar preloader lainnya di tempat lain. Berikut beberapa file loading efek yang sudah saya tambahkan dalam file rar, bisa download di sini dengan dimensi 128x128 pixel: