JSFiddle - React, Tailwind, and code Playground

by matake

HTML

<div id="slide">
	algun contenido algun contenido algun contenido algun contenido 
</div>
<button id="left">slide left</button>
<button id="right">volver</button>

CSS

#slide{
		border: solid 1px;
		width: 500px;
		height: 20px;
	}

JavaScript

$(document).ready(function(){

	$('#left').on('click',function(){
		$('#slide').css({	
			'-webkit-transition': 'all 1s cubic-bezier(1.000, -0.600, 0.595, 0.090)',
			'-webkit-transform':'translateX(-450px)'
		});
	});
	
	$('#right').on('click',function(){
		$('#slide').css({
			'-webkit-transition': 'all 1s cubic-bezier(1.000, -0.600, 0.595, 0.090)',
			'-webkit-transform':'translateX(0px)'		
		});
	});	

});