Cara Menambahkan Efek Loading
1. Bikin animasi loading seperti diatas yaitu dengan cara masuk ke menu Template dan klik Edit HTML
2. Kemudian cari kode ]]</b:skin> atau </style> gunakan Ctrl+F untuk memudahkan pencarian
3. Setelah itu masukkan script berikut tepat diatas kode ]]</b:skin> atau </style> :
============================================================
#cssload {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNpNT6c6HrcfEA4-2eclEjNj6nfTIVt8dND0nYam9Xa823bMPvRciNllOFZCvgxI98JJfQQ-W6s_eNTxgKDtwYwXxhdF2sbK2EbeBpOh43kK31zVY6HqRuY93K-1atLECM0jh_Ty9hUwU/s150/loading.gif) no-repeat center;background-color:rgba(0,0,0,0.36);width:100%;height:100%;position:fixed;left:0;top:0;z-index:1000;}
============================================================
4. Kemudian cari lagi kode <body> gunakan Ctrl+F juga agar cepat
5. Selanjutnya masukkan script berikut tepat dibawah kode <body> :
=========================================
<div id='cssload'/>
=========================================
6. Kemudian cari lagi kode </body> biasanya paling bawah html blog
7. Lalu masukkan script jquery berikut tepat diatas kode </body> :
===================================================================
<script type='text/javascript'>
//<![CDATA[
// Loader
$(window).bind("load",function(){$("#cssload").fadeOut(1e3)});
//]]>
</script>
===================================================================
Jika sudah bisa klik Simpan template.. Selesai dan lihat hasilnya
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNpNT6c6HrcfEA4-2eclEjNj6nfTIVt8dND0nYam9Xa823bMPvRciNllOFZCvgxI98JJfQQ-W6s_eNTxgKDtwYwXxhdF2sbK2EbeBpOh43kK31zVY6HqRuY93K-1atLECM0jh_Ty9hUwU/s150/loading.gif
Sumber : http://carazain.blogspot.com/2016/09/cara-membuat-efek-animasi-loading-keren-di-blog-terbaru.html
Posting Komentar