jQWidgets jqxDragDrop距离属性

  • Post category:jquery

以下是关于“jQWidgets jqxDragDrop距离属性”的完整攻略,包含两个示例说明:

简介

jqxDrag 控件的 distance 属性用于设置拖拽操作开始前鼠标必须移动的像素距离。当鼠标移动的距离小于 distance 属性的值,拖拽操作不会开始。当鼠标移动的距离大于或等于 distance 属性的值时,拖拽操作才会开始。

整攻略

下面是 jqxDragDrop 控件 distance 属性的完整攻略:

  1. 设置 distance 属性
$("#dragDrop").jqxDragDrop({ distance: 10 });

在上述代码中,我们设置了 distance 属性为 10 像素,以设置拖拽操作开始前鼠标必须移动的像素距离为 10 像素。

示例

以下两个示例演示如何使用 distance 属性。

示例1

在此示例中,创建了一个 jqxDragDrop 控件,并将 distance 属性设置为 10 像素。

<div id="dragDrop">
    <div>Drag me</div>
</div>

<script>
    $(document).ready(function () {
        // 创建 jqxDragDrop 控件
        $("#dragDrop").jqxDragDrop({
            distance: 10
        });
    });
</script>

在上述代码中,我们创建了一个 jqxDragDrop 控件,并将 distance 属性设置为 10 像素。

示例2

在此示例中,创建了一个 jqxDragDrop 控件,并将 distance 属性设置为 50 像素。

<div id="dragDrop">
    <div>Drag me</div>
</div>

<script>
    $(document).ready(function () {
        // 创建 jqxDragDrop 控件
        $("#dragDrop").jqxDragDrop({
            distance: 50
        });
    });
</script>

在上述中,我们创建了一个 jqxDragDrop 控件,并将 distance 属性设置为 50 像素。

结语

以上是关于“jQWidgets jqxDragDrop距离属性”的完整攻略,包含属性的介绍和设置 distance 属性的示例。在实际开发中,可以根据需要使用 distance 属性,设置拖拽操作开始前鼠标必须移动的像素距离。