how to animate background image in on hover code example
Example: css animate background image
// use CSS3 @keyframes to animate the background-position
@keyframes animatedBackground {
from {
background-position: 0 0;
}
to {
background-position: 100% 0;
}
}
#animate-area {
width: 200px;
height: 200px;
background-image: url(http://placekitten.com/400/200);
background-position: 0px 0px;
background-repeat: repeat-x;
animation: animatedBackground 10s linear infinite alternate;
}
<div id="animate-area"></div>