Raphael.js API之Element.drag(),Element.toBack()
/*(API-13)*/
Element.drag();
Element.drag(onmove,onstart,onend,[mcontext],[scontext],[econtext])
带[]为可选参数
参数列表:
onmove
function
{
对于moving移动中的处理操作
}
onstart
function
{
对于开始移动前的记录与操作
}
onend
function
{
对于鼠标up之后的操作
}
/*可选参数*/
XXXcontext
可选参数
Object类型
XXX==m
{
执行对移动中的辅助操作
}
XXX==s
{
执行对移动前的辅助操作
}
XXX==e
{
执行结束后的辅助操作
}
以下是触发拖曳drag事件的方式:drag.start.<id>ON START ,drag.end.<id>ON END AND drag.move.<id>ON EVERY MOVE.
当元素可能被拖曳到另外一个元素上的时候,用 drag.over.<id> 会更好。
1)开始事件和操作的执行参数:
1:鼠标的x轴坐标(event.clientX)
2:鼠标的y轴坐标(event.clientY)
3: 事件对象的模型(Object)
2)移动事件和操作的执行参数:
1:相对于开始位置鼠标的x轴位移
2:相对于开始位置鼠标的y轴位移
3:移动中鼠标x坐标
4:移动中鼠标y坐标
3)结束事件和操作的执行参数
1:事件对象模型(Object)
返回值:执行所有操作的原对象
/*API-47*/
Element.toBack()
无参数方法
移动元素,使元素可以脱离当前用户视角,可视为钙元素具有拖曳属性。[常配合drag使用;例如:
var paper = new Raphael(document.getElementById("raphael"), 1920, 1550);
paper.rect(100,200,100,50).drag(onmove,onstart,onend).toBack()
]
Element.drag();
Element.drag(onmove,onstart,onend,[mcontext],[scontext],[econtext])
带[]为可选参数
参数列表:
onmove
function
{
对于moving移动中的处理操作
}
onstart
function
{
对于开始移动前的记录与操作
}
onend
function
{
对于鼠标up之后的操作
}
/*可选参数*/
XXXcontext
可选参数
Object类型
XXX==m
{
执行对移动中的辅助操作
}
XXX==s
{
执行对移动前的辅助操作
}
XXX==e
{
执行结束后的辅助操作
}
以下是触发拖曳drag事件的方式:drag.start.<id>ON START ,drag.end.<id>ON END AND drag.move.<id>ON EVERY MOVE.
当元素可能被拖曳到另外一个元素上的时候,用 drag.over.<id> 会更好。
1)开始事件和操作的执行参数:
1:鼠标的x轴坐标(event.clientX)
2:鼠标的y轴坐标(event.clientY)
3: 事件对象的模型(Object)
2)移动事件和操作的执行参数:
1:相对于开始位置鼠标的x轴位移
2:相对于开始位置鼠标的y轴位移
3:移动中鼠标x坐标
4:移动中鼠标y坐标
3)结束事件和操作的执行参数
1:事件对象模型(Object)
返回值:执行所有操作的原对象
/*API-47*/
Element.toBack()
无参数方法
移动元素,使元素可以脱离当前用户视角,可视为钙元素具有拖曳属性。[常配合drag使用;例如:
var paper = new Raphael(document.getElementById("raphael"), 1920, 1550);
paper.rect(100,200,100,50).drag(onmove,onstart,onend).toBack()
]