JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/velocity/1.5.0/velocity.min.js"></script>
<p>ホバーすると一時停止して離すと再開します</p>
<div class="hover">hover</div>

CSS

.hover {
  display: block;
  width: 300px;
  height: 300px;
  margin: 30px auto 0;
  text-align: center;
  line-height: 300px;
  background: #000;
  color: #fff;
}

JavaScript

$(function(){
	$('.hover').velocity({
		scale: [1, 0.6]
	},
	{
		duration: 1500,
		complete: function(){
			$(this).velocity({
			scale: [0.6, 1]
			}, {
			duration: 1500,
			loop: true
			});
		}
	});
	$('.hover').hover(function(){
  	$(this).velocity('pause');
  },function(){
  	$(this).velocity('resume');
  });
});