Memasang Animasi Preloader di Blog

JejakSeru.com - Kali ini saya akan membahas cara memasang animasi preloader di blog. Animasi preloader adalah animasi yang akan muncul saat loading, animasi ini berguna untuk membuat pengunjung tidak bosan saat loading di blog sedang lambat. Animasi ini juga membuat blog terlihat lebih menarik dari blog yang lainnya.

Berikut Cara Pemasangan Animasi Preloader di Blog

Langkah 1 : Masuk ke dashboard > Template > HTML. Kemudian masukan kode di bawah ini tepat di atas kode </body>.

<style type='text/css'>
#loading{
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#000 url('http://2.bp.blogspot.com/-alum9K2SRYg/VjqAgYxuVCI/AAAAAAAAL-g/dkWivHcWDYg/s1600/preloader.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>

Langkah 2 : Simpan dan lihat hasilnya.

Jika dirasa bermanfaat silahkan share/bagikan ke temen-temen terdekat kamu dan jangan lupa like fanspage facebook kami dan follow twitter kami agar selalu dapat informasi bermanfaat dari kami.

Blogger
Disqus
Pilih Sistem Komentar Yang Kamu Suka

2 comments

Bikin berat blog g ya. Kalo enteng bisa nih pasang animasinya....

Balas

egk kok mas, dijamin ringan mas

Balas