08 May 2014

Membuat Efek Loading Seperti Blog Kang Ismet

Efek Loading Keren

Membuat Efek Loading Keren Seperti Blog Kang Ismet - Selamat datang sobat semua, sekarang saya akan membagikan Tutorial '"Membuat Efek Loading Seperti Blog KI"  efek loading ini memang sudah populer / sudah banyak yang membagikannya, tapi tidak sempurna rasanya jika tutorial ini tidak ada di blog kesayangan sobat semua. Silahkan simak baik-baik tutorial ini.

Langkah Pertama : Buka Blogger > Template > Edit HTML
Langkah Kedua : Masukan kode CSS di bawah ini tepat di atas ]]></b:skin> atau </style>

 #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
    } 


Langkah Ketiga : Masukan kode di bawah ini tepat di atas </head>

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


NOTE : Lewati langkah ketiga, jika template blog sobat telah dipasangkan Libs/Jquery.

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


Langkah Terakhir : Simpan template sobat...

Semoga Tutorial ''Membuat Efek Loading Seperti Blog Kang Ismet'' bermanfaat bagi sobat, jangan lupa like, share, dan komentarnya ya, tunggu tutorial selanjutnya..
SUBSCRIBE TO OUR NEWSLETTER

Add Your Comments

bold <b></b>
italic <i></i>
underline <u></u>
HTML <code></code> use Parser

Emoticon
Parser
Out Of Topic
😊
😉
😀
😁
😎
😍
😜
😑
😇
💖
😯
😱
😭
👍
🍻