Hover me

.hoverme
{
	position: relative;
	width: 100%;
	height: 250px;
	background-color: gold;
}

.hoverme div
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	cursor: pointer;
	font-size: 5rem;
}

.hoverme div::before 
{  
	content: " ";
	display: block;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0 0 0 0;
	background: hsl(200 100% 80%);
	z-index: -1;
	transition: transform .3s ease;
	transform: scaleX(0);
	transform-origin: bottom right;
}

.hoverme div:hover::before {transform: scaleX(1); transform-origin: bottom left;}

echo "<div class='hoverme'>";
echo "<div>Hover</div>";
echo "</div>";