Tuesday, October 18, 2016

Tutorial Cara Membuat Animasi Loading Page Blog dengan jQuerytips

Tutorial Cara Membuat Animasi Loading Page Blog dengan jQuerytips





  1. masuk ke Design > Edit HTML lalu cari kode ]]></b:skin> dan letakan kode berikut ini diatas ]]></b:skin>
  2. untuk memudahkan pencarian tekan tombol CTRL+F

    /* ---------------
    jquery animation loading page
    ---------------------------------- */
    .QOverlay {
    background-color: #000000; /* background color loading */
    z-index: 9999;
    }
    .QLoader {
    background-color: #CCCCCC; /* color bar loading */
    height: 10px;
    }
    .QAmt {
    color:#FF530D; /*loading Color number*/
    font-size:50px;
    font-weight:bold;
    line-height:50px;
    height:50px;
    width:100px;
    margin:-60px 0 0 -50px;
    }
  1. kemudian cari kode </head> dan letakan kode berikut ini di atasnya.
  2. <script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js type=text/javascript/>
    <script src=http://sektim-project.googlecode.com/files/loadingpage.js type=text/javascript/>
  3. Untuk kode yang diberi warna merah (jQuery), tidak usah dipasang lagi jika sudah terdapat di template Anda (cukup 1 saja).
  4. Selanjutnya cari kode </body> dan letakankode berikut ini di atasnya.
  5. <script>
    QueryLoader.selectorPreload = &quot;body&quot;;
    QueryLoader.init();
    </script>
  6. Save template Anda dan coba buka blog Anda untuk melihat hasilnya.
  7. Bila script tidak berfungsi silakan cek ulang apakah Anda sudah mengukuti langkah di atas dengan benar. Jika Anda sudah mengikuti semua langkah dengan benar namun scriptnya tidak berfungsi juga, berarti script tersebut bentrok dengan script yang lain.

Go to link Download

No comments:

Post a Comment