Edit in JSFiddle

$("#start-animation").click(function(){
	if($("#row-1").css("display") !== "none"){
		$(".transform").velocity({
			translateX: "200px"
		}, {
			duration: 1000,
			easing: "ease",
			loop: true
		});
	}
	
	if($("#row-2").css("display") !== "none"){
		$(".trbl").velocity({
			left: "200px"
		}, {
			duration: 1000,
			easing: "ease",
			loop: true
		});
	}
});

$("#animation-select").on("change", function(event){
	event.preventDefault();
	
	if($(this).val() === "transform"){
		if($(".trbl").is(".velocity-animating")){
			$(".trbl").velocity("stop", true);
			$(".trbl").velocity({left: 0});
		}
	
		$("#row-1").css("display", "block");
		$("#row-2").css("display", "none");
	}else if($(this).val() === "trbl"){
		if($(".transform").is(".velocity-animating")){
			$(".transform").velocity("stop", true);
			$(".transform").velocity({translateX: 0});
		}
	
		$("#row-1").css("display", "none");
		$("#row-2").css("display", "block");
	}
});
.box{
	background-color: black;
	width: 100px;
	height: 100px;
	color: white;
	margin-bottom: 10px;
}

.center{
	position: relative;
	top: 50%;
	transform: translateY(-50%); 
	text-align: center;
	width: 100%;
}

.transform{
	background-color: teal;
}

.trbl{
	background-color: orange;
	position: relative;
}

.row{
	display: inline-block;
	width: 300px;
	background-color: white;
}

.row:nth-child(2){
	text-align: right;
	display: none;
}
<select id="animation-select">
	<option default="default" value="transform">Transform</option>
	<option value="trbl">TRBL</option>
</select><br /> 
<button type="button" id="start-animation">Alusta animatsiooniga</button>
<p>Transform - Animatsioon koos CSSi teisendusega (translateX)</p>
<p>TRBL (Top Right Bottom Left) - Animatsioon koos Left omadusega</p>
<div class="row transform" id="row-1">
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
	<div class="transform box"><div class="center">Transform</div></div>
</div>
<div class="row trbl" style="display: none" id="row-2">
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
	<div class="trbl box"><div class="center">TRBL</div></div>
</div>

External resources loaded into this fiddle: