<script src="http://www.google.com/jsapi"></script>
<script>
// Load jQuery
google.load("jquery", "1.2.6");
</script>
<script src="r/insum/files/static/v2Y/ui.core.js"></script>
<script src="r/insum/files/static/v2Y/ui.draggable.js"></script>
<script src="r/insum/files/static/v2Y/ui.droppable.js"></script>
<script>
//Execute as soon as the DOM is loaded
$().ready(function() {
//apply a background-color to prevent content overlapping
$("#my_form_id").css("background-color","white");
//apply draggable property using the region's static ID
$("#my_form_id").draggable({
opacity:0.75,
revert:"invalid",
stop: function(e, ui) {
$(this).parent().css({borderStyle:"none", backgroundColor:"white"});
}
});
//apply droppable property to the parent of our draggable region
$("#my_form_id").parent().droppable({
accept: "#my_form_id",
activeClass: 'droppable-active',
hoverClass: 'droppable-hover',
over: function(e, ui) {
$(this).css({borderStyle:"dashed", backgroundColor:"#D4FF7F"});
},
out: function(e, ui) {
$(this).css({borderStyle:"dotted", backgroundColor:"#FFD455"});
},
drop: function(e, ui) {
$(this).css({borderStyle:"none", backgroundColor:"white"});
}
});
});
</script> |
