JSFiddle - React, Tailwind, and code Playground
by Andrew
HTML
<div id="test"></div>
CSS
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale(1, 1);
}
50% {
-webkit-transform: scale(1.1, 1.1);
}
100% {
-webkit-transform: scale(1, 1);
};
}
@keyframes pulse {
0% {
transform: scale(1, 1);
}
50% {
transform: scale(1.1, 1.1);
}
100% {
transform: scale(1, 1);
};
}
#test {
background: red;
width: 20px;
height: 20px;
-webkit-animation: pulse 1s linear infinite;
animation: pulse 1s linear infinite;
}
#test:hover {
-webkit-animation: none;
animation:none;
}