Cara Mudah Membuat Animasi Loading di Blog - Bagi sobat blogger yang ingin memperindah tampilan blognya, bisa menambah beberapa tampilan yang sederhana tapi bisa membuat blog terkesan lebih indah.
Bisa Lihat : Cara Membuat Posts Artikel Terbaru Berjalan
Salah satu yang dapat memperindah blog yaitu dengan menambahkan efek loading pada blog. bagi sobat yang ingin menambahkan efek ini, silahkan ikuti langkah di bawah.
Cara Mudah Membuat Animasi Loading di Blog :
1. Pertama Login ke akun blog anda dan klik template - edit Html
2. Kedua Lalu Cari kode </style> atau ]]></b:skin>. (Ctrl F untuk mempermudah Pencarian)
Bisa Baca : Cara Bikin Label Cloud Lebih Keren
Jika sudah ketemu, letakan kode dibawah ini tepat dibawah kode tersebut.
#page-loader {
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/AVvXsEhMBwI4qOTlNA5Y6HJ4uRZbWjOBss9MSZCCjf2Ju5HBcSW9l7ydObNIRTOQwFMGXwde8e2sTp3WJohjtSyjWCBqler_Ndx4XJcUMUXuC_Hp16LF7qpo4YMxfy7gvQmFxc3iC-UOzu4Ba4A/s128-no/Loading7.GIF') no-repeat 50% 50%;
color:white;
padding:1em 1.2em;
display:none;
}
Silahkan sobat ganti kode dengan background merah dengan efek loading yang sobat inginkan.
Cari kode </head> dan letakan kode berikut diatasnya.
Jika pada template sobat sudah terdapat scirpt JQuery, lewati saja langkah ini. Karena tidak boleh jika memasang jQuery lebih dari satu.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
3. Ketiga Tambahkan kode berikut dibawah kode </body>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="page-loader"></div>');
$(window).on("beforeunload", function() {
$('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
4. Lalu Save Dan Selesai, Coba lihat blog sobat, apakah sudah terpasang efek loadingnya.
Sangat mudah dan praktis bukan,Itu tadi Bagaimana Cara Mudah Membuat Animasi Loading di Blog buat memperindah blog sobat,selamat mencoba semoga bermanfaat.
Belum ada tanggapan untuk "CARA MUDAH MEMBUAT ANIMASI LOADING DI BLOG"
Post a Comment