Cara Memasang Loading Opacity Pada Halaman Blog

Cara Memasang Loading Opacity Pada Halaman Blog. Sekarang Saya Akan Memberi Tahu Cara Membuat Loading Blognya Unik Dari Transparant Jadi Jelas Dengan CSS Keyframe ,, Ini Gak Akan Buat Blog Berat Kok Jadi Di Coba Aja Ok :D .. 
Kalau Mau Liat Demonya Udah Di Pasang Di Blog Ini Kok Liat Aja Deh Loading Blognya :D

Caranya Kamu Hanya Tinggal Memasukan Script CSS Di Bawah Ini D Atas Kode ]]></b:skin> ,, Nah ini Dia Script CSSnya :D :

@keyframes tb4all

{

from{opacity:0;}

to{opacity:10;}

}

@-moz-keyframes tb4all

{

from{opacity:0;}

to{opacity:10;}

}

@-webkit-keyframes tb4all

{

from{opacity:0;}

to{opacity:10;}

}

@keyframes

{

from{transform:translate(0px, 9000px)}

to{transform:translate(0px, 0px)}

}

@-moz-keyframes

{

from{-moz-transform:translate(0px, 9000px)}

to{-moz-transform:translate(0px, 0px)}

}

@-webkit-keyframes

{

from{-webkit-transform:translate(0px, 9000px)}

to{-webkit-transform:translate(0px, 0px)}

}

#header-wrapper {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 5s;

}

#content-wrapper {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 5s;

}

#main-wrapper {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 5s;

}

#sidebar-wrapper {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 5s;

}

#nav {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;

}

h1,h2,h3,h4,h5,h6,a {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 5s;

}

h1,h2,h3,h4,h5,h6,.post img {

  animation: tb4all 5s;

  -moz-animation: tb4all 5s;

  -webkit-animation: tb4all 8s;

}

Ket.
   Script Di Bawah Ini Yang Sudah Tertera Di Atas Bisa Di Hilangkan Contoh Kamu Tidak Mau Memberi Effect Opacitynya Di Sidebar, Nah Kode Sidebar Itu Adalah #sidebar-wrapper..... Kamu Tinggal Menghilangkannya Dan Sidebar Kamu pun Tidak Akan Terkena Effect Opacity Tersebut Jika Ingin Yang Lainnya Tidak Terkena Effectnya Sama Caranya Hanya Tinggal Menghapus Bagiannya ,, 

#header-wrapper {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;}
#content-wrapper {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;}
#main-wrapper {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;}
#sidebar-wrapper {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;}
#nav {animation: tb4all 5s;-moz-animation: myfirst 5s;-webkit-animation: tb4all 5s;}
h1,h2,h3,h4,h5,h6,a {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 5s;} 

h1,h2,h3,h4,h5,h6,.post img {animation: tb4all 5s;-moz-animation: tb4all 5s;-webkit-animation: tb4all 8s;} 

Kalau Udah Save dan Lihat Hasilnya ,, Gimana Unik Bukan ?
Selamat Mencoba