Tampilan animasi pada loading page ini menggunakan Query Loader, yaitu tampilan layar kosong hitam (bisa diubah) yang meliputi blog anda sampai semua konten dimuat. Artinya pengunjung tidak akan melihat apa yang diloading blog Anda. Pada tampilan ini pengunjung hanya melihat halaman loading dengan bar dan persentase loading secara keseluruhan dengan berwarna gelap. Coba anda refress blog ini? apa yang terlihat. lumayan menarik bukan? ok mari kita bahas cara pembuatannya.
Demo tampilan STATUS LOADING:
Memuat halaman…
Berikut ini langkah-langkah Cara Membuat Loading Blog :
- Buka Blog sobat
- Pada Dashboard pilih Rancangan atau Design
- Edit HTML dan centrang Expand Widget Template
- Cari kode </head> kemudian copy - paste kode di bawah ini sebelum kode tersebut
<script src='https://sites.google.com/site/indolaron/file-js/preloadpage.js' type='text/javascript'/>
- Cari kode <body> , ganti dengan kode dibawah ini:
<body onLoad='PreloadPage();'>
<div id='prepage' style='position: fixed; _position: absolute; top: 0px; right: 0px; clip: inherit; _top: expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-offsetHeight); _left: expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth-offsetWidth); width: 100%; height: 100%; background-color: #000; padding: 0px; border: 0px; text-align: center; filter: alpha(opacity=75); -moz-opacity: .75; opacity: .75; font-family: verdana; font-weight: bold; color: #ccc;'>
<script type='text/javascript'>PreLoading();</script>
</div>
refresh blog sobat dan lihat hasilnya. semoga bermanfaat! :)
visit ya sob http://ravizabagus.blogspot.com
BalasHapus