Ketika Anda membuka website ini, tentu Anda pasti menjumpai LOADING ANIMASI seperti gambar di bawah ini.
Sekarang cari kode <body> untuk memudahkan pencarian tekan Ctrl+F
dan sisipkan kode di bawah ini Tepat di bawah kode <body> .
Website rifaus.com sudah berhasil, semoga keberhasilan ini menular pada Anda. Semoga Bermanfaat..!
Website/blog Anda ingin seperti ini? Ini dia langkah yang harus Anda lakukan :
- Silakan Anda login ke blogger.com
- Cari Kode </head> Agar mudah dalam pencarian tekan Ctrl+F, dan taruh kode di bawah ini tepat di atas kode </head> .
<style>
/* bloggertrix.com */
#md-loading {
position: fixed;
z-index: 50;
top: 0; left: 0;
width: 100%; height: 100%;
background: #FDFEF8 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyM8wr4InMjA2NQO4GLVmNBBOMa2WwXlZ9z6uIoevLo-aNnCa7e68s6YSNOtG5ddA-NSBhYwZO7MinWbsDYsd9r3XlmXA1aps6rr_zBeLzGY-PA7u1512QvG3VRYSmnRawUaIgCfComFoo/s1600/Bloggertrix-loading.gif) no-repeat center;
line-height: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.MD #md-loading { display: none; }
@media only screen and (device-width: 768px) {
#loading {
position:absolute;
width:1040px;
min-height:768px;
}
}
#md-progress-bar {
position: absolute;
top: 0; left: 0;
background: #0d5ff6;
opacity: 0.8;
width: 0;
height: 18px;
}
#md-loader {
height: 100%;
display: none;
}
</style>
<script>
(function($){
$("html").removeClass("MD");
$("#header").ready(function(){ $("#md-progress-bar").stop().animate({ width: "25%" },1500) });
$("#footer").ready(function(){ $("#md-progress-bar").stop().animate({ width: "75%" },1500) });
$(window).load(function(){
$("#md-progress-bar").stop().animate({ width: "100%" },600,function(){
$("#md-loading").fadeOut("fast",function(){ $(this).remove(); });
});
});
})(jQuery);
</script>
Sekarang cari kode <body> untuk memudahkan pencarian tekan Ctrl+F
dan sisipkan kode di bawah ini Tepat di bawah kode <body> .
<div id='md-loading'><div
id='md-progress-bar'></div><div
id='md-loader'>Loading...</div></div>
Website rifaus.com sudah berhasil, semoga keberhasilan ini menular pada Anda. Semoga Bermanfaat..!
Cara Membuat LOADING ANIMASI di Website/Blogger
Reviewed by Redaksi
on
08.21.00
Rating:
Reviewed by Redaksi
on
08.21.00
Rating:
manteb gan
BalasHapusTerima kasih atas kunjungannya, mohon maaf LOADING ANIMASI pada web ini saya hilangkan karena sedikit mengganggu kenyamanan pengunjung.
BalasHapus