Pada posting ini aku mencoba dua macam jenis tampilan gambar loading, yaitu yang pertama berdasarkan gambar animasi gif, sedangkan yang kedua murni permainan css, tapi fungsinya sama, hanya tampilannya saja yang berbeda.
Kegunaan dari sript ini adalah jika kebetulan koneksi lambat atau isi postingan sudah demikian banyak misalnya sudah sampai ratusan halaman posting yang kita share, tentu membutuhkan waktu saat pemangilan file sesuai yang kita pilih berdasarkan judul postingnya. Untuk contohnya bisa sobat klik pada postingan apa saja pada template blog ini.
Jika kita tidak menggunakan script pageloader bukan berarti judul posting yang kita klik tidak mau muncul, tetap saja akan muncul, bedanya cuma jika kebetulan judul posting tersebut merupakan posting lama atau isinya banyak, tentu browser akan bekerja keras mencari dan menampilkan halaman itu, nah pada waktu menunggu file diketemukan, jeda waktu ini akan membuat tampilan halaman template kosong. Maksudnya template hanya menampilkan warna dasar blog saja.. Tapi jika menyisipkan script pageloader maka pengunjung akan melihat animasi atau pemberitahuan jika file tersebut sedang di load oleh browser. Dan animasi ini akan otomatis menghilang setalah halaman di load secara penuh.
Hehehe ngerti gak ya yang di maksud dengan tulisanku diatas ?, kalau tidak ngerti mohon maaf , karena ini adalah catatan pribadiku saja yang aku dapat dari beberapa pakar blog. banyak cara dalam menyisipkan script pageloader tsb, tapi aku pilih yang paling simpel dan tidak bentrok dengan script yang sudah ada.
Masih ingatkan pelajaran bagaimana menulis kode-kode css ? jika lupa silahkan baca ulang.
Page loader berdasarkan Css Murni.
Page loader berdasarkan css murni artinya tidak menggunakan gambar animasi gif, tapi saat muncul tetap membentuk gambar animasi karena diatur dengan webkit-keyframes dan webkit-transform.
Bentuk tampilan cssnya seperti berikut (bisa diubah sesuai keinginan karena css hanyalah pembentuk tampilan, demikian juga namanya loadhalaman bisa diganti dengan buka_halaman) letakan diatas kode ]]></bskin>
Dengan Css seperti diatas, akan menampilkan animasi bola dengan warna merah dengan latar hitam yang berputar kekiri dan kekanan. Sedangkan untuk kode script pemanggilnya adalah sebagai berikut :
Page loader berdasarkan animasi gif
Sedangkan bentuk pageloader yang menggunakan animasi gift penulisan cssnya adalah sebagai berikut :
Pertama sobat harus menentukan animasi pagelodnya dulu kemudian di upload terserah dimana boleh di google code atau di menu posting sebagai contoh seperti ini :
Sedangkan untuk kode script pemanggilnya adalah sebagai berikut :
Setelah kita memahami kode CSS dan penempatan script pada template blog, sekarang kita mencoba mengutak-atiknya agar tampilan blog lebih ...
