For the browsers I've tried (Chrome, Firefox, and IE), the built in crosshair cursor changes to white when it is over a black image and black when it is over a white image. Is there a way to make custom cursors that do this?

div {
  height: 100px;
  width: 100px;
  border: 1px solid black;
}

.black {
  background-color: black;
}

.white {
  background-color: white;
}

.crosshair {
  cursor: crosshair;
}
<div class="black crosshair"></div>
<div class="white crosshair"></div>

Original fiddle.

Thanks much!

html css mouse-cursor
Edit
Report