Kali Ini saya akan mencoba memberikan tutorial 'Cara Membuat Animasi Over Light Pada Blog', Baiklah untuk sobat2 yang masih penasaran dengan tutorial yang saya maksud, sobat bisa arahkan cursor pada bagian widget diblog ini, dan lht hasilnya seperti apa.!! over light dgn cahaya sperti kilat.hehee,..
saya tidak akan panjang lebar untuk tutorial ini, silahkan ikuti lagkah berikut jika diantra klian ingin mencobanya diblog sobat:
Seperti biasa terlebih dahulu : - Login blogger.
- Rancangan, Edit Html, Cari kode ]]></b:skin>
- Dan Letakkan kode berikut diatasnya :
/* Animasi Over Light aka */
@keyframes "hover" {
0% {background:#ffffff;}
100% {background:#111111;color:#000;}}
@-moz-keyframes hover {
0% {background:#ffffff;}
100% {background:#111111;color:#000;}}
@-webkit-keyframes "hover" {
0% {background:#ffffff;}
100% {background:#111111;color:#000;}}
@-ms-keyframes "hover" {
0% {background:#ffffff;}
100% {background:#111111;color:#000;}}
@-o-keyframes "hover" {
0% {background:#ffffff;}
100% {background:#111111;color:#000;}}
#subscribe:hover, #blog-pager-newer-link:hover, #blog-pager-older-link:hover, .comments:hover,.cm_entry p:hover, .comment-body-author:hover, .comment-form:hover, .sidebar .widget-content:hover, .tabdiv .widget:hover, .creditutta:hover, .post-body:hover, #searchform input[type="text"]:hover {
-webkit-animation: hover 0.2s 100ms;
-moz-animation: hover 0.2s 100ms;
-ms-animation: hover 0.2s 100ms;
animation: hover 0.2s 100ms;}
-Kode warna MERAH adalah warna pada saat hover, Anda bisa ganti dan sesuaikan dengan keinginan sobat.
- Kode warna KUNING adlah warna teks pada saat hover terjadi.
- Sedangkan warna HIJAU adlah kode css yang akan kita berikan efek animasi over light.
4. Langkah terakhir save template. dan lihat hasilnya.
Mungkin cukup sekian Cara Membuat Animasi Over Light Pada Blog . jika ada yang perlu ditanyakan silahkan tinggalkan komentar sobat dikolom yang tersedia. mksih slmat berkreasi. :)
