Tutorial Membuat Animasi Loading Saat Blog Di Buka

Tampilan tertentu saat loadingblog dapat menjadi daya tarik tertentu bagi pengunjung. Ini memungkinkan kalian untuk memperbaiki ketidakberaturan konten saat dibuka, sehingga pengunjung hanya melihat animasi layar loading. Postingan kali ini kami akan membagikan tutorial cara Membuat Animasi Loading Saat Blog di Buka menggunakan jquery dan css. Tampilan animasi ini terdapat halaman loading menggunakan Query Loader, yang merupakan layar hitam kosong (dapat diubah warnanya) yang menutupi blog kalian sampai semua konten dimuat. Ini berarti bahwa pengunjung tidak akan melihat apa yang dimuat blog kalian. Dalam tampilan ini, pengunjung hanya melihat halaman loading dengan bilah dan persentase umum dengan warna gelap. 

Baiklah mari kita bahas bagaimana cara melakukannya. Ikuti langkah-langkah di bawah ini.

1. Log in ke blog anda
2. Klik Rancangan
3. Klik Edit HTML
4. Masukkan kode berikut di atas kode </head>

<script src='http://code.jquery.com/jquery-1.5.min.js' type='text/javascript'/> <script src='http://blogger-loader.googlecode.com/files/queryLoaderpre.js' type='text/javascript'/> 

5. Selanjutnya masukkan kode berikut di atas kode </body>
   

   <script> QueryLoader.selectorPreload = &quot;body&quot;; QueryLoader.init(); </script>

6. Selanjutnya masukkan kode berikut di atas kode ]]></b:skin>
   

   .QOverlay {background-color: #000000; /* warna background saat blog anda di loading */z-index: 9999;}
   .QLoader {background-color: #CCCCCC; /* warna bar loading */height: 1px;}
   .QAmt {color:#FF530D; /* warna angka persentase saat loading */font-size:50px;font-weight:bold;line-height:50px;height:50px;width:100px;margin:-60px 0 0 -50px;}

7. Klik Simpan Template
8. Selesai dan lihat hasilnya
9. Selamat mencoba dan sukses selalu

Share this post