DEV Community

Vaishali1192
Vaishali1192

Posted on

Create Zoom in zoom out animation effect in CSS

  • To create zoom in zoom out effect we need to focus on two elements "width" and "height".
  • First define proper height width of an element.
  • Add Css to that element
  • We need to use @keyframes to define animation


@keyframes zoom-in-zoom-out {
0% {
transform: scale(1, 1);
}
50% {
transform: scale(1.5, 1.5);
}
100% {
transform: scale(1, 1);
}
}

Top comments (0)