JSFiddle - React, Tailwind, and code Playground

by fparent

HTML

<div></div>

CSS

div {
 width: 250px;
 height: 250px;
 background: #15e1ff;  
 cursor: pointer;   
}

.animate {  
     -moz-animation-duration: 3s;  
     -moz-animation-name: slidein;  
}  

@-moz-keyframes slidein {  
from {  
  margin-left: 100%;  
  width: 300%  
}  

to {  
  margin-left: 0%;  
  width: 100%;  
}  
}

JavaScript

(function() {
    
    $( 'div' ).on( 'click', function( e ) {
        $( this ).toggleClass( 'animate' );
        
    });
    
    
}())