Powered by Blogger.

Cara Membuat Efek Loading Blog Dengan @Keyframes

Membuat Efek Loading Blog Dengan @Keyframes artinya adalah apabila pada saat halaman Blog dimuat, loading Blog akan menimbulkan efek smooth(halus) seperti yang sobat lihat di Blog ini. Ya seperti itu kira-kira. Jika sobat mau memasangnya ikuti tutorialnya dibawah ini :


  • Login dulu ke akun Blogger sobat
  • Klik Template > Edit HTML > Centang Expand Widget Template
  • Cari Kode ]]></b:skin> agar cepat pencarian tekan F3
  • Pastekan kode dibawah ini tepat diatas kode ]]></b:skin>
 @keyframes myfirst { from{opacity:0;} to{opacity:10;} } @-moz-keyframes myfirst { from{opacity:0;} to{opacity:10;} } @-webkit-keyframes myfirst { 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: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} #content-wrapper {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} #main-wrapper {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} #sidebar-wrapper {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} #nav {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} h1,h2,h3,h4,h5,h6,a {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 5s;} h1,h2,h3,h4,h5,h6,.post img {animation: myfirst 5s;-moz-animation: myfirst 5s;-webkit-animation: myfirst 8s;}
  • Save template 
 Silahkan sobat lihat hasilnya loading blog sobat akan menjadi halus
Anda baru saja membaca artikel yang berkategori Efek-Efek dengan judul Cara Membuat Efek Loading Blog Dengan @Keyframes. Anda bisa bookmark halaman ini dengan URL http://malang-cyber4rt.blogspot.com/2013/01/cara-membuat-efek-loading-blog-dengan.html. Terima kasih!
Ditulis oleh: Unknown - Saturday, January 19, 2013

2 komentar untuk "Cara Membuat Efek Loading Blog Dengan @Keyframes"