Skip to content
Related Articles

Related Articles

Improve Article

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:




My Personal Notes arrow_drop_up
Recommended Articles
Page :