Effect Animasi Pada Header blogger

Author : Unknownuntuk mengenal lebih jauh tentang mas mahfid silahkan klik link Info Blog

orang yang selalu ingin tahu ,mencoba sesuatu yang di anggap orang lain sulit dan berusaha untuk menjadi bisa Sobat sedang membaca artikel tentang Effect Animasi Pada Header blogger. Silahkan tinggalkan jejak di kolom Komentar untuk mempermudah Unknown berkunjung kembali ke blog sobat.

Masih tentang Keyframes Css3 ternyata juga bisa kita fungsikan pada header blog ,nah yang akan Info Blog kasih pada Tutorial Kali ini bagai mana cara membuat Effect Animasi Pada Header Blogger ,sebagai contoh coba sobat lihat pada header blog ini selain warna fontnya bisa berganti warna juga bisa bergerak ke kanan dan ke kiri Nah untuk cara membuat nya sobat bisa langsung praktek dengan mengikuti tutorialnya seperti di bawah ini.

1. Silahkan Loggin ke blogger.com
2. Pilih template lalu sobat pilih bagian Edit Html
3. Gunakan Ctrl +f   cari kode ]]></b:skin> masukkan kode css berikut tepat di bawah kode ]]></b:skin> berikut kodenya :

   <style>#header{width:auto;
   height:50;
   background:none;
   position:relative;
   animation:mymove 5s infinite;
   -moz-animation:mymove 5s infinite; /* Firefox */
   -webkit-animation:mymove 5s infinite; /* Safari and Chrome */
   -o-animation:mymove 5s infinite; /* Opera */
   }
   
   @-moz-keyframes mymove /* Firefox */
   {
   0% {left:0px;color:green}
   50% {left:200px;color:red}
   100% {left:0px;color:orange}
   }
   
   @-webkit-keyframes mymove /* Firefox */
   {
   0% {left:0px;color:green}
   50% {left:200px;color:red}
   100% {left:0px;color:orange}
   }
   
   @-ms-keyframes mymove /* Firefox */
   {
   0% {left:0px;color:green}
   50% {left:200px;color:red}
   100% {left:0px;color:orange}
   }
   
   @-o-keyframes mymove /* Firefox */
   {
   0% {left:0px;color:green}
   50% {left:200px;color:red}
   100% {left:0px;color:orange}
   }</style>

4. untuk mengatur pergerakan header edit bagian  %{left:...px} 
5. Jangan lupa yang terakhir SAVE template