JSFiddle - React, Tailwind, and code Playground
HTML
<!--put these scripts in HEAD for jquery/jqueryUI/jqueryUI-css-->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<div id="peg_icon">peg</div>
JavaScript
$(document).ready(function(){
$('#peg_icon').draggable({
revert: function (obj) {
if (obj === true) {
// success
return false;
}
else {
// reverting
alert("Reverting!");
return true;
}
},
scroll: false,
stack: "#peg_icon",
drag: function(event, ui) {
$('#peg_icon').css('background-image','url(images/peg-icon-when-dragged.png)');
}
});
});