Hi campers! This is the first time I’ve made something like this so I could use your opinion and also, I would like to make his eyes roll if possible, but I’m not sure how. Thanks in advance
You can use keyframes.
I changed your CSS, you can use the code below to test and figure it out from there.
I changed the class .right-eye to
.eye-right{
position: absolute;
background: white;
height: 25%;
width: 25%;
border-radius: 50%;
z-index: 2;
right: 18%;
top: 33%;
animation-name: roll;
animation-duration: 1s;
animation-iteration-count: infinite;
}
and I added the following to your CSS
@keyframes roll {
0% {
transform: scale(1) rotate(-90deg);
}
50% {
transform: scale(0.6) rotate(-90deg);
}
}
Good job, by the way!
2 Likes