Cara Membuat Efek Loading Seperti Blog Kang Ismet

Cara Membuat Efek Loading Seperti Blog Kang Ismet - Selamat pagi semua , selamat datang di blog saya .Sudah lama saya tidak mengupdate artikel blog saya karena ke sibukan saya di dunia nyata untuk meningal ketertinggalan kali ini saya akan berbagi cara membuat efek loding seperti blog kang ismet . Jika anda ingi membuat loading efek seperti blog kang ismet perhatikan tutorial berikut ini .

Efek Loding Blog Kang Ismet

Cara Membuat Efek Loding Seperti Blog Kang Ismet :

1. Buka Blogger > Template > Edit HTML

2. Copy kode di bawah ini paste di atas ]]></b:skin>

#page-loader {
    position:fixed !important;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:999999;
    background: #303030 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGlO-a_JPjPC-NfbuX8axjwab1QiV-jr1JR8Gir5pDsiSIydS7O-1wjJRJT5p0vj-oBT8hVtz-saLWEEwOS6oDiF_mibcc7nT5qrUC-0kRyuJ0tz1wfbnmIHzx9x6qiTWCGerNfLWAtP0/s200/load6.gif") no-repeat 50% 50%;
    padding:1em 1.2em;
    display:none
    }

3 .  Copy kode di bawah ini paste di atas </head>

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

4. Copy kode di bawah ini paste 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>

5. Simpan

Semoga bermanfaat bagi anda :)

Regards, Admin - Brian Adam

 

Share :

Tweet

✚

Related Post