form#searchform2{display: block;float:right;margin: 30px 14px 10px 5px;}input.searchinput{background:#fff;border: 1px solid#006699;color:#006699;height:30px;}.searchsubmit{background:#006699;border:1px solid#006699;color:#fff;height: 32px;} .post {-moz-border-radius: 20px ; -webkit-border-radius: 2; border-radius: 20px ; padding:20px; border: 5px solid #ff0000; } #navbar-iframe { height:0px; visibility:hidden; display:none } #Label1 li { float:left; width: 48%; } -->

Lencana Facebook

Selasa, 08 Januari 2013

Membuat Animasi saat Loading di Blog

Memang banyak cara blogger untuk mempercantik tampilan blognya agar terkesan canggih, menarik, unik, khas, dll. Salah satunya dengan memasang Animasi ini di blog  sobat. Bila para blogger sudah banyak yang tahu akan trik ini, ya gpp juga liat-liat. Dan untuk yg belum tau, ini mungkin akan membuat tampilan blog anda makin keren. Animasi ini adalah animasi yg bekerja saat
loading yang kita alami dalam memperbarui suatu halaman. Jika sobat agak penasaran, lihat gambar berikut ebagai contoh dari Animasi Loading.



Animasi Loading
Jika sobat dengan senang hati ingin memasang nya di blog sobat, maka ikuti langkah-langkah yang tertera dibawah ini dengan cermat.
Step :
1. Masuk ke blogger
2. Pilih Template > Edit Template > Lanjutkan
3. Kemudian Centang Expand Widget Template
4. Cari script <body> (mempermudah pencarian ctrl + f)
5. Jika sudah ketemu, hapus kode tersebut dan ganti dengan script berikut.




<body onLoad='waitPreloadPage();'> <!-- Loading with Image --> <div id='prepage' style='display:scroll;position:fixed;top:100px;left:3px'><img border='0' src='http://loadinggif.com/images/image-selection/12.gif/></div> <!-- Ends Loading with Image -->

Catatan : script yang berwarna merah adalah URL dari animasi yg kita peroleh. Animasi lainnya dapat di cari di Loading Giff

6. Jika sudah selesai, cari lagi kode </body>, lalu hapus juga dan ganti dengan script berikut :





<script language='javascript' src='http://pageprotection.googlecode.com/files/loading.js' type='text/javascript'/></body>


7. Jika sudah selesai, kemudian pilih Pratinjau, atau jika sudah beres/tidak ada masalah langsung aja pilih Save Template.

Tidak ada komentar:

Posting Komentar

Ainan Tasneem

http://picasion.com
create an animated gif here at http://picasion.com gif maker