2012-09-10 15:33:46 +00:00
<!doctype html>
2008-12-30 15:51:51 +00:00
< html lang = "en" >
< head >
2010-09-10 13:17:58 +00:00
< meta charset = "utf-8" >
2009-01-15 21:57:33 +00:00
< title > jQuery UI Draggable - Revert position< / title >
2010-09-10 13:17:58 +00:00
< link rel = "stylesheet" href = "../../themes/base/jquery.ui.all.css" >
2012-11-14 20:22:01 +00:00
< script src = "../../jquery-1.8.3.js" > < / script >
2010-09-10 13:17:58 +00:00
< script src = "../../ui/jquery.ui.core.js" > < / script >
< script src = "../../ui/jquery.ui.widget.js" > < / script >
2012-01-28 15:57:36 +00:00
< script src = "../../ui/jquery.ui.interaction.js" > < / script >
2010-09-10 13:17:58 +00:00
< script src = "../../ui/jquery.ui.draggable.js" > < / script >
< link rel = "stylesheet" href = "../demos.css" >
< style >
2012-01-31 03:39:03 +00:00
.ui-draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
2008-12-30 15:51:51 +00:00
< / style >
2010-09-10 13:17:58 +00:00
< script >
2012-01-31 03:39:03 +00:00
$(function() {
$( "#draggable" ).draggable({
stop: function( event, ui ) {
$( event.target ).animate( ui.originalPosition );
}
});
$( "#draggable2" ).draggable({
helper: true,
stop: function( event, ui ) {
ui.helper.animate( ui.originalPosition, function() {
ui.helper.remove();
});
// prevent the draggable plugin from removing the helper
event.preventDefault();
2012-01-28 15:57:36 +00:00
}
});
2008-12-30 15:51:51 +00:00
});
< / script >
< / head >
< body >
2010-09-10 13:17:58 +00:00
2008-12-30 15:51:51 +00:00
< div id = "draggable" class = "ui-widget-content" >
< p > Revert the original< / p >
< / div >
< div id = "draggable2" class = "ui-widget-content" >
< p > Revert the helper< / p >
< / div >
2010-09-10 13:17:58 +00:00
< div class = "demo-description" >
2012-01-31 03:39:03 +00:00
< p > The < code > stop< / code > callback can be used to perform an action after the user finishing dragging the element. For example, if you want to return the draggable (or it's helper) to its original location when dragging stops, you can do so in the < code > stop< / code > callback.< / p >
2012-09-10 15:33:46 +00:00
< / div >
2008-12-30 15:51:51 +00:00
< / body >
< / html >
