JSFiddle - React, Tailwind, and code Playground

by ninadpachpute

HTML

<script src="http://threedubmedia.com/inc/js/jquery-1.4.2.min.js"></script>
<script src="http://threedubmedia.com/inc/js/jquery.event.drag-2.0.min.js"></script>
<script src="http://threedubmedia.com/inc/js/jquery.event.drop-2.0.min.js"></script>
<script src="http://threedubmedia.com/inc/js/excanvas.min.js"></script>

<script type="text/javascript">
jQuery(function($){
   $('.drag').drag(function( ev, dd ){
      $( this ).css({
         top: dd.offsetY,
         left: dd.offsetX
      });
   });
   $('.drop').drop(function(){
      $( this ).toggleClass('dropped');
   });
});
</script>

<div class="drag" style="left:100px;"></div>

CSS

.drag {
   position: absolute;
   border: 1px solid #89B;
   background: #BCE;
   height: 58px;
   width: 58px;
   cursor: move;
   top: 100px;
   line-height: 58px;
   text-align: center;
   }