Cara Membuat Efek Loading Blog Ala Blog Kang Ismet

Selamat siang sobat bloger, bagai mana punya kabar? suadah lama rasanya saya tidak menerbitkan artikel di blog ini. allhamdulillah di siang ini saya di beri kesempatan untuk posting di blog ini. siang ini saya akan posting tentang Cara Membuat Efek Loading Blog Ala Blog Kang Ismet.

Mungkin anda sudah pernah dengar dengan nama Blog Kang Ismet. Kang Ismet sudah sangat terkenal di kalangan blogger. jika anda penasaran dengan blog kang ismet silahkan anda masuk ke alamat ini www.blog.kangismet.net

Pada waktu yang lalu saya sudah posting tentang Cara Membuat Sitemap/Daftar Isi Ala Blog Kang Ismet. dan pada kesempatan kali ini saya akan posting tentang Cara Membuat Efek Loading Blog Ala Blog Kang Ismet. jika anda ingin memasang nya mari ikuti caranya di bawah ini.

1. Silahkan anda masuk dulu ke akun blogger anda.
2. Masuk Template => Edit HTML
3. Simpan CSS di bawah ini di atas kode ]]></b:skin>

#page-loader {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:999999;
background:#303030 url("http://3.bp.blogspot.com/-sW166HTPK4U/UY2kVNdjsFI/AAAAAAAAEHk/fIO-B-mOeCE/s200/load6.gif") no-repeat 50% 50%;padding:1em 1.2em;display:none;


4. Simpan JQuery di di bawah ini tepat di atas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>


Catatan:
Jika di template blog anda sudah ada kode yang mirip di atas, langkah ini lewati saja.

5. Simpan kode di bawah ini di atas 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 halamanlain...
$(window).on("beforeunload", function() {
// ... tampilkan tabir animasi dengan efek `.fadeIn()`
$('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);});
//]]>
</script>


6. Simpan template anda, dan silahkan lihat hasilnya. Nah, Mungkin cuma itu saja poatingan kali ini tentang Cara Membuat Efek Loading Blog Ala Blog Kang Ismet. Semog Bermanfaat.

Reaksi:
Share this with short URL:

You Might Also Like:

How to style text in Disqus comments:
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Hide Parser