JSFiddle - React, Tailwind, and code Playground
HTML
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<div>Make sure and show the console log!</div>
<div id='drag_div'>
Drag Me
</div>
<div id='animate_div'>
Watch Me Move
</div>
CSS
#drag_div { width: 100px; height: 100px; background-color: yellow; }
#animate_div { width: 100px; height: 100px; background-color: orange; position: relative; }
JavaScript
$(function() {
$( '#drag_div' ).draggable({
revert: true,
revertDuration: 500,
start: function ( event, ui ) {
$( '#animate_div' ).animate( { left: 500 }, 10000 );
},
stop: function ( event, ui ) {
$( '#animate_div' ).stop();
}
});
})