Cara Masang Animasi Loading di Blog (Ultra Keren)
Yey saat ini blog dah berumur 2 bulan~~
dan pengunjungnya dah sampe 3000an~
#ngefly
Langsung aja :
Cara Masang Animasi Loading di Blog (Ultra Keren) - Pada tampilan awal blog biasanya di tambahkan animasi loading yang menarik, hal ini dimaksudkan untuk menginformasikan kepada pengunjung blog bahwa data halaman web atau blog sedang dalam proses download dan ektrasi data yang akan di render pada browser. Animasi Loading dibuat menggunakan JQuery sebagai engine script untuk membuat animasi loading blog yang super keren.
Cara Pemasangan :
[1]Login ke blog sobat...
[2]Klik "More Options" selector box kemudian klik "Template" setelah itu pilih "Edit HTML".
[3]Apabila anda sudah memasang kode JQuery silakan anda lewati bagian ini. Cari kode</Html> kemudian letakan kode berikut ini tepat diatas kode </Html>.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>Cari kode </Body> kemudian letakan kode berikut ini tepat diatas kode </Body>.
<style type='text/css'>[4] Save deh
#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/AVvXsEjfHxsZN4_d5oqsWPWj2tWUQQIn7v9ZsPM2WKek6G69BwO7dUnQ3BOkHT2TMUVNGP38Yh8gS8KClJBUqcPLgLo_Q0aEQOkV_O8cOUFwwF-2Svbu5qzkj-SWdJ-5H5xZM7BgTIP8p8jiEpk/s1600/loadinfo.net+%284%29.gif') no-repeat 50% 50%;
color:white;
padding:1em 1.2em;
display:none;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
$('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
Catatan :
- Kode berwarna biru merupakan URL gambar animasi.
- Untuk pilihan animasi loading blog lainnya silakan anda kunjungi cssload.net.
Category: INTERNET
0 comments