Sambil nunggu pertandingan bola nih, dari pada bete nungguin mendingan berbagi ilmu lagi nih!Langsung aja deh sekarang saya mau berposting tentang
Cara Buat Animasi Loading Di Blog tetapi kali ini animasinya beda dari yang lain pokoknya keren deh.. ini adalah sreenshotnya:
Gemana? keren kan.. oke langsung aja nih caranya
- Buka editor Template dengan cara mengeklik Template > Edit HTML > Lanjutkan
- Cari Kode </head> Agar mudah dalam pencarian tekan Ctrl+f, dan sisipkan kode di bawah ini Tepat di atas </head> .
<style>
/* henry-multimedia-informasi.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/AVvXsEj4EKaEFw187TG8eJ4ZcWIsjbZG6QpQ3-BaF_IWTsqe_CVjP2IAeNTDGB3W2n4LpN0AkNGo-ue2TbEJN8s-vn1mnPrrt2tcLNa68uZqOKGU2SMq_q-StOygrTY_woQ6nOZ47-Q_Vzl8FoUG/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> agar mudah dalam penacrian 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>
Bagaimana mudahkan?Oke Cukup sekian, Semoga Bermanfaat..!
Posts
Download Download Aplikasi Raport Kurikul 2013 Format Excel Di Bawa Ini Download Semoga Bermanfaat Salam Kambus...
Naskah Pidato Singkat Dan Terlengkap Kumpulan Contoh Naskah Pidato Terlengkap - Contoh Pidato Hari Kemerdekaan RI, Bahaya Narkoba,...
Selamat siang sahabat bloger kali ini saya bawakan tutorial Memprotect Cell Tertentu pada Lembar Kerja Excel, mungkin sudah tidak pada a...
Kompetensi Inti serta Kompetensi Dasar merupakan bagian dari kerangka dasar Kurikulum 2013 serta jadi rambu-rambu atau satu diantara acua...
Aplikasi ini dibuat untuk mempermudah kerja administrasi / Tata Usaha melakukan pencetakan SKHUN sementara, dan tentu saja ini bisa jug...
Tutorial Memisahkan Kata dengan rumus Excel Untuk memisahkan kata yang ada pada sebuah cell misalnya saya contohkan pada sebuah cell ter...
MEMBUAT RANKING DENGAN EXCEL Kalau tutorial excel terdahulu mengenai rumus ranking dan count, kali ini kita matangkan pembahasan khusus...
0 comments:
Post a Comment