Pagi ini saya akan melanjutkan posting saya kali ini saya akan membahas tentang
Membuat Effect Loading Halaman dengan sedikit Bumbu CSS & Javascript apa sih yang dimaksud Bumbu CSS & Javascript ? kode penuh rasa jadi saya ibaratkan itu bumbu & javascript #filosofi.
Saya tidak berbicara panjang lebar mari kita simak berikut ini :
- Perhatikan Bumbu CSS dibawah ini, jika sudah dirubah lalu simpat tepat sebelum bumbu ]]></b:skin>
#page-loader { position:fixed !important; position:absolute; top:0; right:0; bottom:0; left:0; z-index:9999;background:#000url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx0cJAn28QwMIHXqzY7eDchxCeAKTBIWYDBI72aR9OtIkqE1VWW5EXV4dgElt1uSmiaV_jp366qB5mPkp7d7KzZYigYafV7q9aWUiidddbL-PFj8rtPJA09E9XXvEQaDEC6j6xwNsfB7c/s1600/loadinfo.net+%284%29.gif') no-repeat 50% 50%;color:white;padding:1em 1.2em;display:none;}
( keterangan kode yang saya beri warna ubahlah sesuka sobat )
Biru : Diganti dengan warna background sesuka sobat
Merah : Diganti dengan alamat gambar/animasi dengan berformatkan (.GIF)
- Jika sudah, simpan bumbu Javascript dibawah ini tepat sebelum kode </body>
<script type='text/javascript'>//<![CDATA[$(document.body).append('<div id="page-loader">Loading...</div>');$(window).on("beforeunload", function() { $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);});//]]></script>
- Kalau udah, simpan template
Semoga tips yang saya bagikan kepa sobat semua bisa bermanfaat ...
Sumber:blog.riandesign.web.id (agak gue edit dikit)