JSFiddle - React, Tailwind, and code Playground

by Adam Kinnucane

HTML

<div class="scalable-div">
</div>

CSS

.scalable-div {
	height: 800px;
	width: 800px;
	background: red;
    position :relative;
    -webkit-animation: mymove 5s infinite; /* Safari 4.0 - 8.0 */
    animation: mymove 5s infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes mymove {
    25% {transform:scale(0.5);}
    50% {transform:scale(1);}
	 75% {transform:scale(0.5);}
    100% {transform:scale(1);}
}

/* Standard syntax */
@keyframes mymove {
    25% {transform:scale(0.5);}
    50% {transform:scale(1);}
	 75% {transform:scale(0.5);}
    100% {transform:scale(1);}
}

JavaScript

function scale() {
	var $objects_wrapper = $(".scalable-div");
	setInterval(function(){			
		$objects_wrapper.animate({
			transform:"scale(0.5)" }, {duration: "slow"
		});
	}, 1000);
}

scale();