Cara Membuat efek loading rubik pada Blog ~ Just One Click

Pasti kalian tau apa gambar di atas tersebut ? Gambar itu adalah Mengubah Loading menjadi Rubik / Kotak - Kotak . Menurut saya Ini bagus cocok sekali buat agan - agan di blog . Baiklah tidak usah berlama lama langsung ke Intinya saja . Check This Out!

Langkah 1

1. Masuk ke Akun Blog kalian
2. Masuk Ke Template >> Edit HTML
3. Cari Kode </head> untuk mempermudah tekan CTRL+F tulis </head>
4. Pastekan Kode Berikut Diatas Kode </head>

<style> 
/*  loader http://purwakartailmu.blogspot.com/*/
#SEO BLOG-load {
position: fixed;
z-index: 50;
top: 0; left: 0;
opacity: 0.9;
width: 100%; height: 100%;
background: #FDFEF8 url(http://3.bp.blogspot.com/

-WqA4mLrQVsw/U4COhzzQi2I/AAAAAAAABrw/57-G3Pw25ek/s128-no/Loading.gif)

no-repeat center;
line-height: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.MD #SEO BLOG-load { display: none; }
@media only screen and (device-width: 768px) {

#loading {
position:absolute;
width:1040px;
min-height:768px;
}
}

#SEO BLOG-progbar {
position: absolute;
top: 0; left: 0;
background: #ED0000;
opacity: 0.8;
width: 0;
height: 5px;
}

#md-loader {
height: 100%;
display: none;
}
</style>

<script>
(function($){
$(&quot;html&quot;).removeClass(&quot;MD&quot;);
$(&quot;#header&quot;).ready(function(){ $

(&quot;#bingangbingung-progbar&quot;)

.stop().animate({ width: &quot;25%&quot; },1500) });
$(&quot;#footer&quot;).ready(function(){ $

(&quot;#bingangbingung-progbar&quot;)

.stop().animate({ width: &quot;75%&quot; },1500) });
$(window).load(function(){
$(&quot;#bingangbingung-progbar&quot;).stop().animate(

{ width: &quot;100%&quot;}

,600,function(){
$(&quot;#bingangbingung-load&quot;).fadeOut(&quot;fast&quot;

,function()

{ $(this)

.remove(); });
});
});
})(jQuery);
</script>

Langkah Ke 2

1. Cari Kode <head>
2. Pastekan Kode ini di bawah <head>

<div id='SEO BLOG-load'><div id='SEO BLOG-progbar'/>

<div id='md-loader'> Loading...</div></div>

Yang Terakhir Simpan

Cara Membuat efek loading rubik pada Blog

Related Post