Jika kita terus membahas Kreatifitas dunia Koding Website terutama pada kreasi template blog ada banyak yang mampu kita kreasikan, dari mulai membuat tampilan Blog berwarna-warni hingga yang terlihat elegant dan bagus untuk dilihat. Memang tidak mampu dipungkiri salah satu faktor yang membuat pengunjung betah berlama-lama di blog ialah tampilan yang membuat enak dilihat mata.
Namun ada banyak juga blogger yang hanya memnapilkan template blog yang sederhana saja menyerupai template yang dipakai dibalikseo ini simple hanya putih sebab kebetulan aku lebih suka yang simple saja lumayan mampu mengurangi beban loading.
Dipostingan ini terkait perihal keindahan dan kreasi penampilan pada blog, kita akan membahas tampilan blog yang akan kita hiasi dengan Animasi Loading sederhana yang secara otomatis akan tampil dikala ada yang berkunjung ke blog dan otomatis akan hilang ketika halaman sudah tamat dimuat.
Bagi sahabat yang mau mencobanya mari kita simak pembahasannya yaitu Cara Membuat Efek Animasi Loading Sederhana di Blogger.
Langkah Pertama
Silahkan salin aba-aba CSS dibawah ini lalu letakkan aba-aba tersebut sebelum aba-aba ]]></b:skin> atau di aba-aba </style>.
Langkah Ke Dua
Silahkan salin aba-aba HTML ini lalu letakkan dibawah aba-aba <body>.
Langkah Ke Tiga
Silahkan tambahkan aba-aba Jquery dibawah ini lalu letakkan di atas </body>.
Perhatikan langkah penerapan kodenya kalau sudah sesuai petunjuk silahkan SAVE, selamat mencoba biar bermanfaat.
#cssload {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNYXM_fr3jJkrD79DcyFdf6li6eMyI9T2xoEMe81_LzdTIIUQh0GDP2x-w0Aj6b0VKure9TVTkYRYDaCBaiKH_YuBFfz7l-avpu6wq_chIVhEk7r5IPvDTgTGZRwEC3B1PLVx1gAXQK6E/s1600/loading.gif) no-repeat center;background-color:rgba(0,0,0,0.36);width:100%;height:100%;position:fixed;left:0;top:0;z-index:1000;}Langkah Ke Dua
Silahkan salin aba-aba HTML ini lalu letakkan dibawah aba-aba <body>.
<div id='cssload'/>Langkah Ke Tiga
Silahkan tambahkan aba-aba Jquery dibawah ini lalu letakkan di atas </body>.
<script type='text/javascript'> //<![CDATA[ // Loader $(window).bind("load",function(){$("#cssload").fadeOut(1e3)}); //]]> </script>Perhatikan langkah penerapan kodenya kalau sudah sesuai petunjuk silahkan SAVE, selamat mencoba biar bermanfaat.
Comments