zoukankan      html  css  js  c++  java
  • Jqueryui draggable

    Jquery ui的draggable插件让某个元素能被鼠标拖拽。

    draggable和droppable的区别:

    draggable只是控制拖拽,如果你要控制拖拽和放下两个动作,你需要使用的是droppable插件

    draggable有三个事件可以定义回调函数:

    start, stop, drag

    这三个事件定义的回调函数可以有两个参数,一个是原始的浏览器定义的事件,另一个是插件定义的事件,假定为ui

    ui拥有的属性有:

    ui.helper

    ui.position

    ui.offset

    drag的动作的时候可以设置helper,就是在拖动的时候鼠标旁边显示的提示工具条

    draggable的属性有:

    disabled: 是否设置此属性可拖拽

    addClass:当设置为false的时候,ui-draggable这个class就不会加到上面

    appendTo: 指示draggable的时候的helper的container

    axis:允许的值是x或者y,限定拖拽只能在x轴变化和只能在y轴变化

    connectToSortable:

    containment: 拖拽元素所在的容器

    cursor: 拖拽的时候鼠标样式

    cursorAt: 设置helper相对于鼠标的位置

    delay: 设置拖拽动作生效的延迟时间

    distance: 设置拖拽动作生效的延迟距离

    grad:拖动过程中鼠标移动的单位

    helper: helper显示设置

    iframeFix:解决拖动过程中与iframe层叠后的事件问题

    opacity:设置helper的透明度

    refreshPositions: 是否重新计算位置

    revert:设置拖拽回复到原始位置

    revertDuration:拖拽回复到原始位置的延迟时间

    scope: 设定draggable的域, 用来和droppable结合使用时确定可放入的目标

    实时了解作者更多技术文章,技术心得,请关注微信公众号“轩脉刃的刀光剑影”

    本文基于署名-非商业性使用 3.0许可协议发布,欢迎转载,演绎,但是必须保留本文的署名叶剑峰(包含链接http://www.cnblogs.com/yjf512/),且不得用于商业目的。如您有任何疑问或者授权方面的协商,请与我联系

  • 相关阅读:
    获取数字的位数
    使用json把php数据传给js处理
    Java实现带括号优先级的计算器
    Java使用正则表达式解析LRC歌词文件
    Android开发环境搭建:离线安装ADT插件和安装SDK
    【转】C语言快速幂取模算法小结
    【转】Java高手真经全套书籍分享
    10.19stark组件开发(三)
    10.18正式开发stark组件*(三)
    10.17正式开发stark项目(二)
  • 原文地址:https://www.cnblogs.com/yjf512/p/2611038.html
Copyright © 2011-2022 走看看