script.aculo.us 拖放约束选项

script.aculo.us 库是一个跨浏览器库，旨在改进网站的用户界面。拖放模块可用于使任何元素可拖放，也可以将它们拖放到放置区域中。

约束选项用于限制可拖动项目在拖动时的移动方向。它可以设置为“水平”或“垂直”，从而只允许沿该方向移动。

句法：

{ constraint: value }

参数：此选项具有如上所述和如下所述的单个值：

• value：这是一个字符串值，用于指定受约束的方向。它可以是“水平的”或“垂直的”。默认值设置为空。

下面的示例说明了此选项的使用。

例子：

HTML

  

  
  
  
  
  
  
  
    window.onload = function () {
  
      // Draggable element with 
      // constraint set to 'horizontal'
      new Draggable('elem1', 
                    { constraint: 'horizontal' });
  
      // Draggable element with 
      // constraint set to 'vertical'
      new Draggable('elem2',
                    { constraint: 'vertical' });
    };
  

  

  
    
      GeeksforGeeks
    
  
  
  
    script.aculo.us Drag &
    Drop constraint Option
  
  
    
  
    Drag the elements to see the
    effect of the constraint option. 
    Element 1 has the constraint set 
    to 'horizontal' and Element 2 has
    the constraint set to 'vertical'.
  
  
  
  

  

输出：