Salam jumpa lagi dengan saya, share
posting ini sudah banyak dibahas di Dunia Maya, Saya hanya ikut
meramaikan saja untuk bisa berbagi dengan sobat semua. Effect Loading
Page ini sebuah widget yang hanya menunda waktu Loading baik saat
pertama kali membuka Web atau membuka halaman Blog, dengan Script yang
boleh dibilang simple.
Cara-nya :
Login ke Blogger
Klik Monetize -> Template -> Edit HTML (jangan lupa back-Up template)
Cari Kode
</b:skin> (gunakan Ctrl+F)
Copy Paste kode CSS dibawah ini sebelum Kode Tag
</b:skin>
#loading {
position: fixed;
z-index: 50;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #333333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVtT5ZBSIz_RY69m18a6UVufXitRr0YBotqivkulbUoZykdnOV2jrEPAoCeNVX3xlrxF_joA01ye3C1SFets6Afs9SFrRGW7jfTUNRXMK55z1Nt3QXJ_itexFjee-tblRmQ-kLLzCGu-4/s1600/ajax-loader.gif) no-repeat center;
line-h eight: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.wwy #loading {
display: none;
}
#progress-bar {
position: absolute;
top: 0;
left: 0;
background: #eee;
opacity: 0.8;
width: 0;
height: 18px;
}
Karena ini menggunakan Javascript jadi tambahkan Kode dibawah ini sebelum TAG
</head>
<script type='text/javascript'>
(function($){$("html").removeClass("wwy");
$("#header").ready(function(){ $("#progress-bar").stop()
.animate({ width: "25%" },1500) });
$("#footer").ready(function(){ $("#progress-bar").stop()
.animate({ width: "75%" },1500) });
$(window).load(function(){ $("#progress-bar").stop()
.animate({ width: "100%" },600,function(){ $("#loading")
.fadeOut("fast",function(){ $(this)
.remove(); }); });});})(jQuery);
</script>
Agar berfungsi tambahkan Kode TAG berikut ini sesudah TAG
<body>
<div id='loading'> <div id='progress-bar'> </div> </div>
Apabila dipergunakan hanya untuk Halaman Utama memakai TAG Kondisional cara-nya seperti ini
<b:if cond='data:blog.url == data:blog.homepageUrl'> <div
id='loading'> <div id='progress-bar'> </div> </div>
</b:if>
Semoga Share posting ini bisa menambah pengetahuan sobat semua. terima kasih
