setCapture() in javascript

setCapture() method in javascript

setCapture() method is used to move all the control to an particular element when the mouse is clicked and to release it when the mouse is released.

Example

Try Yourself

Example Explanation

  • In the above example the div element is stored in elem variable (elem = document.getElementById("divID")).
  • mousedown, mouseup and mousemove eventlistners are added for elem.
  • When the mouse is clicked inside the div element mousedown event is triggered, within it funMouseDown function is called.
  • In funMouseDown, setCapture() method is called and mousemove event is triggered, within it funMouseMoved function is called.
  • Now, when the mouse is dragged inside the div element its x and y position are found and displayed.
  • When the mouse is released mouseup event is triggered, within it funMouseUp function is called.
  • Within the funMouseUp function mousemove Eventlistner is removed.