jQuery UI Overview

jQuery UI is a curated set of interactions, widgets, effects, and themes built on jQuery.

Including jQuery UI

<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>

Draggable

$("#draggable").draggable();
$("#draggable").draggable({ axis: "x", containment: "parent" });

Droppable

$("#droppable").droppable({
    drop: function(event, ui) {
        $(this).addClass("dropped").text("Dropped!");
    }
});

Sortable

$("#sortable").sortable();
// Now list items can be dragged to reorder

Datepicker

$("input.date").datepicker({ dateFormat: "yy-mm-dd" });

Dialog

$("#dialog").dialog({
    title: "My Dialog",
    modal: true,
    buttons: { OK: function() { $(this).dialog("close"); } }
});