JQuery Easy UI draggable (drag) component

As mentioned above, the JQuery Easyui plugin reference is generally used in two ways (excluding the Easyload loading method), so the draggable component to be summarized in this article is also loaded in two ways:

(1), using the class load mode:

<div id= "box" class= "easyui-draggable" style= "width:400px;height:200px;background:red;" >
Content section
</div>

(2), JS load call

$ (' #box '). draggable ();

Also mentioned above, the use of the class attribute is not conducive to the expansion of other properties of the component, so we use the way JS call, the following article is also the way to use JS call.

The component has several properties, methods, and triggering events that are not listed here, and are placed in the code sample and annotated.

Example:

<! DOCTYPE html>
Click to download source code
JQuery Easy UI draggable (drag) component