How 2 Make A Draggable Element! (HTML)

Step 1

We first need to get the JQuery libraries.

Copy and paste this:

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Credits Go To code.jquery.com For The Libraries!

Step 2

For our actual JQuery code, we have:

$(function(){
  $( "element" ).draggable();
});

The dragging works for:

• Elements with the id attribute
• Elements with the class attribute

Using Id

The name of an element's id goes before an # symbol, like this:

$(function(){
  $( "#id_name_of_element" ).draggable();
});

Using Class

The name of an element's class goes before an . symbol, like this:

$(function(){
  $( "class_name_of_element" ).draggable();
});

Downsides

• Doesn't work on mobile
• Doesn't work for inputs and textareas
• Will always stay in a div

Anyways...

The Tutorial Is Done.

Bye!