After testing on Chrome, Firefox, and IE, I discovered that the built-in crosshair cursor displayed as white when hovering over a black image, and black when over a white image. Is there a way to create custom cursors that behave in this manner?
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>Thank you very much!