mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
c15481eeb1
Conflicts: demos/draggable/constrain-movement.html demos/draggable/cursor-style.html demos/draggable/default.html demos/draggable/events.html demos/draggable/handle.html demos/draggable/revert.html demos/draggable/visual-feedback.html demos/droppable/default.html grunt.js tests/unit/draggable/draggable.html tests/unit/draggable/draggable_core.js tests/unit/draggable/draggable_options.js tests/unit/draggable/draggable_test_helpers.js tests/unit/droppable/droppable.html tests/unit/droppable/droppable_options.js ui/draggable.js ui/jquery.ui.droppable.js ui/sortable.js
51 lines
1.5 KiB
HTML
51 lines
1.5 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>jQuery UI Draggable - Revert position</title>
|
|
<link rel="stylesheet" href="../../themes/base/all.css">
|
|
<script src="../../jquery-1.10.2.js"></script>
|
|
<script src="../../ui/core.js"></script>
|
|
<script src="../../ui/widget.js"></script>
|
|
<script src="../../ui/interaction.js"></script>
|
|
<script src="../../ui/draggable.js"></script>
|
|
<link rel="stylesheet" href="../demos.css">
|
|
<style>
|
|
.ui-draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
|
|
</style>
|
|
<script>
|
|
$(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();
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<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>
|
|
|
|
<div class="demo-description">
|
|
<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>
|
|
</div>
|
|
</body>
|
|
</html>
|