Tutorial Belajar Blog | Tips Blog | Informasi Tentang Blog - Membuat Animasi Loading Page Di Blog, Merupakn Tutorial edit blog tidak beda jauh dari tips sebelum nya Langkah Membuat Animasi Loading Blog Lebih Menarik , Untuk membedakan coba sendiri ataupun liat dari gambar yang sudah ada maaf tidak demo untuk tutorial ini
Script animasi loading page ini saya dapat dari http://www.gayadesign.com yang merupakan versi awal dari script tersebut. Untuk membuat dan memasang animasi loading page pada blog kalian, masuk pada Design - Edir HTML dan cari kode ]]></b:skin> dan letakan kode dibawah ini diatas ]]></b:skin>
kemudian cari kode </head> dan letakan kode dibawah ini diatasnya
selanjutnya cari kode </body> dan letakankode dibawah ini diatasnya
Save template kalian dan coba buka blog kalian untuk mengetestnya
Semoga bermanfaat,
Script animasi loading page ini saya dapat dari http://www.gayadesign.com yang merupakan versi awal dari script tersebut. Untuk membuat dan memasang animasi loading page pada blog kalian, masuk pada Design - Edir HTML dan cari kode ]]></b:skin> dan letakan kode dibawah ini diatas ]]></b:skin>
/* ---------------
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;
}
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;
}
kemudian cari kode </head> dan letakan kode dibawah ini diatasnya
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://oktridarmadi.googlecode.com/files/loadpage.js' type='text/javascript'/>
<script src='http://oktridarmadi.googlecode.com/files/loadpage.js' type='text/javascript'/>
untuk kode yang diberi warna merah, jika kode tersebut sudah ada dalam template kalian, kalian tidak perlu menambahkan kode tersebut (cukup 1 saja)
selanjutnya cari kode </body> dan letakankode dibawah ini diatasnya
<script>
QueryLoader.selectorPreload = "body";
QueryLoader.init();
</script>
QueryLoader.selectorPreload = "body";
QueryLoader.init();
</script>
Save template kalian dan coba buka blog kalian untuk mengetestnya
Semoga bermanfaat,
Advertisment
0 komentar:
Posting Komentar