script.aculo.us Drag & Drop reverteffect Option
Last Updated :
12 Mar, 2021
This script.aculo.us Drag & Drop reverteffect Option is used returns to its defined position when the drag ends. It also specifies whether the reverteffect callback will be invoked when the drag operation stops.
Syntax:
new Draggable('element', {reverteffect: 'effectFunction'});
Values:
- reverteffect: This option takes the reverteffect function.
Example:
HTML
<!DOCTYPE html>
< html >
< head >
< script type = "text/javascript"
src = "prototype.js" >
</ script >
< script type = "text/javascript"
src = "scriptaculous.js" >
</ script >
< script type = "text/javascript" >
window.onload = function () {
var img = 'gfg';
new Draggable('gfg', {
revert: true,
reverteffect: function () {
new Effect.MoveBy('gfg', 100, 100);
}
});
}
</ script >
</ head >
< body >
< div >
< h1 style = "color: green" >
GeeksforGeeks
</ h1 >
< p >
A Computer Science
Portal for Geeks
</ p >
</ div >
< strong >
script.aculo.us Drag &
Drop reverteffect Option
</ strong >
< p >Drag and leave the image</ p >
< img id = "gfg" src = "gfg.png" >
</ body >
</ html >
|
Output:
Share your thoughts in the comments
Please Login to comment...