Cursor style does not change when the mouse button gets pressed in Internet Explorer 9 and later versions

This article provides information about solving the issue that the cursor style of a hovered DOM element does not change when the mouse button remains pressed in Internet Explorer 9 and later versions.

Original product version:   Internet Explorer 9 and later versions
Original KB number:   2743603

Symptoms

In Internet Explorer 9 and later versions, the cursor style of a hovered DOM element is ignored if the mouse button remains pressed and then remains pressed outside of the particular DOM element. This may be observed if a web page has implemented a DragAndDrop functionality in which the cursor style is used to visualize whether a drop zone allows dropping or not.

This behavior only occurs when a <div> tag is implemented as follows:

<div style="cursor: wait;"></div>

If you are outside of this div area and you press the mouse button and keep it pressed while moving into the area, the cursor will not change once entering this area.

Cause

This behavior is by design beginning in Internet Explorer 9.

Resolution

To modify this behavior, use the onmouseover and onmouseout events as follows:

<div onmouseover="this.style.cursor='wait'" onmouseout="this.style.cursor='pointer'" ></div>