Cara Membuat Efek Loading Di Blog

Hahihuheho - Kali ini saya akan berbagi tips, yaitu CARA MEMBUAT EFEK LOADING
 

Langsung saja kagak pake lama...


Langkah Membuat Efek Loading...

1.  Masuk TEMPLATE --> EDIT HTML
2. Cari kode ]]></b:skin>
3. Masukkan kode dibawah ini tepat diatas Kode ]]></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/AVvXsEgzJdvijz3cYlfWf3_5qq7US2kJkXJpHoVOyejdeSLhyqRmjACTFP46qxx230oJPPVBWqax1EEH3Jpvxx-D1JRJtszZ52hmx4zdsm-4lRP25lrtv-5yQB8ez7iruVPm6aqn-XLn79XV39BW/s320/load+labeltutorial.gif") no-repeat 50% 50%;
padding:1em 1.2em;
display:none
} 

   Keterangan : Kode warna merah bisa diganti dengan URL gambar milik sobat sendiri.
   
   
   4. Masukkan kode dibawah ini tepat 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>

   5. Save & lihat hasilnya
   

    

loading...