Cara sederhana membuat kustom preloading screen website dengan JavaScript
tambahkan js ini dihalaman webmu
<script >maksud js tersebut adalah ketika halaman masih loading maka area dengan class .preloading akan dimunculkan dan setelah loading halaman benar-benar selesai, area preloading tsb akan hilang secara fadeout dan pengunjung web dapat mengakses halaman web.
jQuery(document).ready(function($) {
$(window).load(function() { $(".preloading").fadeOut("slow"); })
});
</script>
tambahkan tag html berikut setelah tag <body>
<div class="preloading">maksud tag html tsb adalah preloading berserta konten dalam class .preloading dalam hal ini adala text loading dengan nama class .textpreload yang akan dimunculkan saat halaman web masih loading. kita dapat mengganti text loading ini dengan gambar animasi (Gif) ataupun animasi css.
<div class="textpreload">LOADING</div>
</div>
Kemudian tambahkan css
.preloading {width: 100%;
text-align: center;
height: 100%;
position: fixed;
background: #000000;
z-index: 999999;
top: 0px;
display: table;
left:0}
.preloading .textpreload {
display: table-cell;
text-align: center;
vertical-align: middle;}
banyak sekali situs yang menyediakan gambar preloading ini, contohnya kamu dapat mengambilnya dari sinihttp://preloaders.net/en/free
Sumber : Klik disini
Tidak ada komentar