拖放使用 reverteffect 選項

說明

此選項用於定義當可拖動元素返回其起始位置時要使用效果。

預設為平滑滑動元素的原始位置。reverteffect 選項指定當 revert 選項設為 true 時，在 endeffect 函式之前呼叫的函式。

語法

new Draggable('element', {reverteffect: 'effectFunction'});

其中 effectFunction 是定義要應用的效果的函式。

示例

即時演示

<html>
   <head>
      <title>Draggables Elements</title>
		
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      <script type = "text/javascript" src = "/javascript/scriptaculous.js"></script>
		
      <script type = "text/javascript">
         window.onload = function() {
            var img = 'myimage';
            new Draggable('myimage' , {
            revert: true,
            reverteffect: function(){
               new Effect.MoveBy('myimage', 100,100);
               }
            });
         }
      </script>
   </head>

   <body>
      <p>Drag and leave this image to see the result.</p>
      <img id = "myimage" src = "/images/scriptaculous.gif"/>
   </body>
</html>

執行上述操作會得到以下結果 -

scriptaculous_drag_drop.htm

列印頁面