lihat juga

Saturday, July 14, 2012

Membuat Effec pelangi pada link dengan Css3 animasi

K
alau sebelumnya kita pernah membuat effec pelangi pada link dengan menggunakan kode script ,mungkin dengan pertimbangan looding akan bertambah berat kita enggan untuk memasangnya ,nach kang Mahfid punya solusinya nich.....!!  karena yang akan kita gunakan untuk tutorial kali ini adalah Full kode Css3 , nah sebagai  contoh coba sorot dengan Cursor link di bawah ini


EFFEC PELANGI DENGAN CSS3 ANIMASI


Keuntungan kita mengggunakan css3 amation ini selain tidak membuat looding blog semakin berat juga kita bisa dengan mudah merubah warna link sesuai yang kita ingin kan dan kita juga dapat merubah kecepatan perubahan link dari warna yang satu ke warna yang lain nya
Nah untuk cara membuatnya letakkan kode css3 animasi di bawah ini tepat di atas kode  ]]></b:skin> berikut kode css3 nya :
@keyframes effecpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-o-keyframes effecpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-ms-keyframes effecpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-moz-keyframes effecpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} @-webkit-keyframes effecpelangi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}} a:hover{ /* http://karinafotocollection.blogspot.com*/ -o-animation:effecpelangi 4s infinite; /* Opera */  -ms-animation:effecpelangi 4s infinite; /* IE */  -moz-animation:effecpelangi 4s infinite; /* Firefox */  -webkit-animation:effecpelangi 4s infinite; /* Safari and Chrome */   }
Untuk merubah kecepatan perubahan warna sobat bisa rubah teks yang berwarna merah ,misal kita rubah menjadi 1s maka perubahan warna link akan semakin cepet dan sobat bisa juga merubah Color/warna sesuai dengan keinginan sobat....oke selamat mencoba ....

ads

Ditulis Oleh : gdfysx Hari: 6:54 PM Kategori:

0 comments:

Post a Comment

surf