i want to make a draggable div with jquery just only move in its parentconsole says draggable is not a function

To create a draggable div with jQuery that only moves within its parent, you can use the following code:

HTML:

<div id="parent">
  <div id="drag"></div>
</div>

CSS:

#parent {
  width: 400px;
  height: 400px;
  border: 1px solid black;
  position: relative;
}

#drag {
  width: 100px;
  height: 100px;
  background-color: blue;
  position: absolute;
  top: 50px;
  left: 50px;
  cursor: move;
}

jQuery:

$(document).ready(function() {
  $("#drag").draggable({
    containment: "#parent"
  });
});

This code creates a parent div and a child div (the draggable div). The draggable div is positioned absolutely inside the parent div and given a blue background color. The jQuery code initializes the draggable function on the draggable div, with the containment option set to the parent div. This means that the draggable div can only be dragged within the confines of the parent div.

Make sure that you have included the jQuery UI library in your HTML file, otherwise you will get the error "draggable is not a function". You can include the jQuery UI library by adding the following line to the head section of your HTML file:

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