Show:

GestureEdgePan Class

在窗口边缘区域往窗口中心区域拖进的拖动手势事件。当将元素在窗口边缘区域往窗口中心区域拖进时触发,默认边缘区域为窗口上下左右四个方向顶端往窗口中心靠近的 '60px' 的区域。例如,窗口宽度为320,那么横坐标 0~60 和 260~320 这段区域就是边缘区域的一部分,当某元素在这个区域往窗口中心区域拖进时触发事件。 引入模块则可以使用相应事件。

使用示例:

require(['node', 'event-dom/gesture/edge-pan', 'dd'], function($, GestureEdgePan, DD){
    new DD.Draggable({   //使得 #test 元素能被拖动
        node : '#test',
        move:true
    });

    $('#test').on(GestureEdgePan.EDGE_PAN_START, function(ev){ //在边缘区域往窗口中心区域开始拖进时触发
        //edge pan start...
    });
    $('#test').on(GestureEdgePan.EDGE_PAN, function(ev){  //在边缘区域往窗口中心区域拖进中时触发,如果已经超过边缘区域也会一直触发直到放开鼠标
        //edge paning...
    });
    $('#test').on(GestureEdgePan.EDGE_PAN_END, function(ev){  //在边缘区域往窗口中心区域拖进,放开鼠标时触发,如果已经超过边缘区域也会一直触发直到放开鼠标
        //edge pan end...
    });
});
  • Index
  • Events

Events

EDGE_PAN

在边缘区域往窗口中心区域拖进中时触发,如果已经超过边缘区域也会一直触发直到放开鼠标 返回的事件对象包括格外下面的属性:

  • pageX {Number} 鼠标横坐标位置
  • pageY {Number} 鼠标纵坐标位置
  • distance {Number} 当前鼠标位置与开始事件时位置的距离
  • duration {Number} 从开始事件到目前的时间
  • velocityX {Number} 横坐标速率
  • velocityY {Number} 纵坐标速率
  • direction {String} 方向 : left/right/up/down

EDGE_PAN_END

在边缘区域往窗口中心区域拖进,放开鼠标时触发,如果已经超过边缘区域也会一直触发直到放开鼠标 返回的事件对象包括格外下面的属性:

  • pageX {Number} 鼠标横坐标位置
  • pageY {Number} 鼠标纵坐标位置
  • distance {Number} 当前鼠标位置与开始事件时位置的距离
  • duration {Number} 从开始事件到目前的时间
  • velocityX {Number} 横坐标速率
  • velocityY {Number} 纵坐标速率
  • direction {String} 方向 : left/right/up/down

EDGE_PAN_START

在边缘区域往窗口中心区域开始拖进时触发 返回的事件对象包括格外下面的属性:

  • pageX {Number} 鼠标横坐标位置
  • pageY {Number} 鼠标纵坐标位置
  • distance {Number} 当前鼠标位置与开始事件时位置的距离
  • duration {Number} 从开始事件到目前的时间
  • velocityX {Number} 横坐标速率
  • velocityY {Number} 纵坐标速率
  • direction {String} 方向 : left/right/up/down