Powered by Blogger
Theme images by Igniel

Report Abuse

Stats

Comment

Home  ›  CSS  ›  HTML  ›  jQuery  ›  Tips Blogger

Inilah Cara Memperlihatkan Efek Animasi Loading Sederhana Ketika Halaman Dimuat

Post a Comment
Cara Memberikan Efek Animasi Loading Sederhana Saat Halaman Dimuat - Pada kesempatan ini akan membuatkan tutorial memasang dampak animasi loading dikala halaman dimuat yang dapat teman tambahkan di blog. Cara kerja dari trik ini sebenarnya sangat sederhana adalah arahan akan berjalan ketika teman membuka blog dikala proses memuat halaman dan akan berhenti secara otomatis ketika halaman tersebut telah termuat dengan penuh.

Cara Memberikan Efek Animasi Loading Sederhana Saat Halaman Dimuat Inilah Cara Memberikan Efek Animasi Loading Sederhana Saat Halaman Dimuat

Bagi teman yang ingin mencoba menambahkan Efek Animasi Loading Sederhana di blog, silakan ikuti langkah berikut ini

Memasang Efek Animasi Loading Sederhana di Blog


1. Login ke Blogger > Buka Template editor > Tambahkan arahan di bawah ini sebelum ]]></b:skin> atau </style>

#cssload {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinXHhP348t3xAHq-XGRsxXM4OnW4LpkxAzcQ9bnj9RA__GxKv-W1FMYqrqdgIhkBiJsqXcgTQF8j5pC8CK7oUv5_PXxGHjK6uw9-k-aMdb2dmw39jhoSehBJZctGLxsDPx9L92y7tAuVg/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;}

2. Selanjutnya tambahkan arahan di bawah ini di bawah <body>

<div id='cssload'/>

2. Tambahkan arahan di bawah ini sebelum </body>

<script type='text/javascript'> //<![CDATA[ // Loader $(window).bind("load",function(){$("#cssload").fadeOut(1e3)}); //]]> </script>

4. Simpan template dan lihat hasilnya.


Demikian tutorial Cara Memberikan Efek Animasi Loading Sederhana Saat Halaman Dimuat. Semoga bermanfaat.
CSS HTML jQuery Tips Blogger
SHARE WhatsApp

Related Posts

Post a Comment

Post a Comment