Jumat, 06 Juli 2012

Membuat Efek Link Blog Kelip Kelip seperti Pelangi

Pengen gak link di blog kita warnanya ganti ganti kayak pelangi?? Dengan efek seperti itu blog kita akan jadi lebih menarik dan unyu :3. Cara pasangnya sih sangat mudah pake banget. Tinggal ikuti tahapan tahapannya berikut ini :
  • Kunjungi blogger.com
  • Di Menu Drop Down klik Layout ---> Add a gadget ---> HTML/JavaScript
  • Lalu Copy Paste kode berikut pada kolom yang tersedia :
<script src="http://tutorialblogspot.googlecode.com/files/LinkPelangi.js" type="text/javascript"></script>
  • Klik Simpan.
Selesai deh :D, simple kan, bisa juga pake cara manual di bawah ini. Ini buat para blogger yang lagi belajar soal css n udah cukup mahir. Ini source codenya :

<style type='text/css'>
@-keyframes pelangi{
0% { color:red }
20% { color:yellow}
40% { color:green}
60% { color:blue}
80% { color:purple}
100%{ color:orange}
}
@-webkit-keyframes pelangi{
0% { color:red }
20% { color:yellow}
40% { color:green}
60% { color:blue}
80% { color:purple}
100%{ color:orange}
}
@-moz-keyframes pelangi{
0% { color:red }
20% { color:yellow}
40% { color:green}
60% { color:blue}
80% { color:purple}
100%{ color:orange}
}
@-o-keyframes pelangi{
0% { color:red }
20% { color:yellow}
40% { color:green}
60% { color:blue}
80% { color:purple}
100%{ color:orange}
}
@-ms-keyframes pelangi{
0% { color:red }
20% { color:yellow}
40% { color:green}
60% { color:blue}
80% { color:purple}
100%{ color:orange}
}

a{text-decoration:none;}
a:hover{animation:pelangi 3s infinite alternate;-webkit-animation:pelangi 3s infinite alternate;-moz-animation:pelangi 3s infinite alternate;-o-animation:pelangi 3s infinite alternate;-ms-animation:pelangi 3s infinite alternate;
}

</style> 

Tidak ada komentar:

Posting Komentar