Cara Membuat Efek Loading Sederhana

Hallo sahabat blog? Kemabali lagi bersama saya, sudah lama ini saya jarang post dikarenakan kesibukan di kantor dan lain sebagainya. Baiklah langsung saja pada inti artikel ini yaitu cara membuat efek loading sederhana saat halaman blog sobat sedang dimuat.
efek-loading-sederhana
Oh iya, cara ini saya dapatkan dari blog kesayangan saya yaitu Mbak Arlina. Jika ada beberapa script yang eror mohon maaf yah atau bisa diskusikan dengan saya melalui contact form.

Sebelum memulai, jangan lupa untuk backup dulu template blog, caranya masuk ke tema/theme-download/bacup.

Setelah itu, baru kita mulai tutrialnya yah. Langkah pertama yaitu masuk ke edit html blog sobat, kemudian masukan kode dibawah ini tepat sebelum kode ]]></b:skin> atau </style>.




#cssload {background:url(http://2.bp.blogspot.com/-gwEckHVvyvM/VnbiQdPPZSI/AAAAAAAADcE/wwKnP62ARpc/s1600/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;}


Selanjutnya, sobat tambahkan kode dibawah ini, tepat dibawah kode <body>.

<div id="cssload">


Kemudian tambahkan kode dibawah ini, tepat sebelum kode </body>.

<script type='text/javascript'>
//<![CDATA[
// Loader
$(window).bind("load",function(){$("#cssload").fadeOut(1e3)});
//]]>
</script>

Nah, setelah itu silahkan sobat save atau simpan templatenya dan lihat hasilnya. 
Robbi Zaelani Tidak ada ruginya mengahabiskan waktu dan biaya untuk melakukan sesuatu yang bersifat HOBI.

Berlangganan update artikel terbaru via email:

0 Response to "Cara Membuat Efek Loading Sederhana"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Iklan