How to solve the problem that mouseout will also trigger after triggering mousedown?

I want to achieve the following functions:

  1. you can change the div size by dragging after pressing the mouse
  2. when the mouse is released, the div does not move with the mouse.

problems encountered:

Press the mouse and move the mouse out of the window, release the mouse, and after moving into the window, you can drag to resize the div without pressing the mouse.

cause of the problem

is mainly because the mouseup event is not triggered and the mouse is moved out of the window. As a result, the parameters do not change. Try to use the mouseout event to detect whether the mouse is removed from the browser or a div, but the mouseout is triggered at the same time as the mousedown is triggered. In this way, you can"t even change the size.

Mar.10,2021
Menu