Selamat Siang Semua pada kali ini saya akan share yaitu cara membuat animasi loading page di Blogger
sedikit tentang animasi loading page yaitu memberikan tampilan penuh seperti saat kita login pada blog kita dan waktu loading page bisa di hitung dengan animasi loading ini karena animasi ini sendiri menggunakan hitungan persen
1.masuk ke design > edit html > terus cari kode ]]></b:skin> dan letakan kode berikut di atas nya
/* ---------------
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;
}
2.kemudian cari kode </head> dan letakan kode berikut di atas nya
<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.kemudian cari kode </head> dan kemudian letakan di atasnya
<script>
QueryLoader.selectorPreload = "body";
QueryLoader.init();
</script>
4.kemudian klik save
5.dan kemudian lihat hasil nya :)
sedikit tentang animasi loading page yaitu memberikan tampilan penuh seperti saat kita login pada blog kita dan waktu loading page bisa di hitung dengan animasi loading ini karena animasi ini sendiri menggunakan hitungan persen
1.masuk ke design > edit html > terus cari kode ]]></b:skin> dan letakan kode berikut di atas nya
/* ---------------
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;
}
2.kemudian cari kode </head> dan letakan kode berikut di atas nya
<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.kemudian cari kode </head> dan kemudian letakan di atasnya
<script>
QueryLoader.selectorPreload = "body";
QueryLoader.init();
</script>
4.kemudian klik save
5.dan kemudian lihat hasil nya :)
Jangan Lupa commen nya dan kunjungi terus blog saya http://berbagitips46.blogspot.com
supaya saya lebih giat lagi untuk mencari aplikasi-aplikasi yang
terbaru atau anda bisa request software yang anda ingin kan siapa tau
saya bisa bantu cari
sekian terimakasih semoga bermanfaat ^_^ | |
0 comments:
Post a Comment