Cara Membuat Animasi Loading Blog di Blogger

Selamat Malam Sobat, 3 hari ga ketemu saya nih gara-gara saya sakit :-(, dan akhirnya pada kesempatan kali ini saya sembuh juga dan dapat ngepost artikel lagi. artikel saya kali ini adalah "Cara Membuat Animasi Loading Blog di Blogger" sebenarnya ini cuma untuk membuat pengunjung blog  biar ga jenuh dengan loading yang lama di blog-blog dan membuat blog terlihat keren hahaha. Untuk previewnya silahkan lihat gambar diatas. Sekarang kita simak caranya :

1. Tambahkan jQuery di Blog kalian. Simpan jQuery dibawah diatas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>

*Jika Blog Sobat Sudah Terpasang jQuery, Silahkan Lewati Langkah Pertama

2. Simpan CSS dibawah diatas kode ]]></b:skin> atau </style>

#animasi-loading-blog {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:9999;
background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0eq-5bQiT7RRbncvr70asYAtdXmvKAcQ_rzjXH0DKB_WCB18Uut9eFLQbU9BSQ-dzC84Wn7fS2s4mTqTcv9CXTGoZYahdBkKqS-AnLLKWQY86IjhYili2Rh-Y4AmxKaRJOma7iJYNA6U/s1600/loadinfo.net+%284%29.gif') no-repeat 50% 50%;
color:white;
padding:1em 1.2em;
display:none; }

3. Tambahkan JavaScript dibawah diatas kode </body>

<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="animasi-loading-blog"></div>');
$(window).on("beforeunload", function() {
    $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>

4. Simpan Template

Oke mungkin cukup sampai disini artikel yang berjudul "Cara Membuat Animasi Loading Blog di Blogger" kalau ada yang tidak dimengerti silahkan tanya ke saya. - See more at: http://kang-zaruf.blogspot.com/2014/02/cara-membuat-animasi-loading-blog-di-blogger.html#sthash.5co7eI6H.dpuf

Related Posts:

Tweet