Hi there RapidTrans, I hope you are having a good morning today.
I'm glad that I spotted this question because I will surely be able to help.
The great thing about CSS is that you can customize animations any way you'd like and they are extremely easy to make. I am going to include a codebox below that might help you.
@keyframes vibrate {
0%{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
25%{
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
50%{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
75%{
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
100%{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
}
Inside this shaking animation, you can declare at certain percentages of the animation what you want to occur. Also, this animation is extremely easy to edit to your liking.. so that is great! By the way I got this animation from Button Animations With Code CSS, all credit for the code in the codebox goes to them.
I hope that the codebox and recourses I linked will help you be more comfortable in make CSS animations.
Have an amazing day!
