2

I'm attempting to work out why some CSS3 cursor options work and some do not in TideSDK desktop applications. Presently, I've determined the following cursor options work:

  • auto
  • default
  • help
  • pointer
  • progress
  • wait
  • crosshair
  • text
  • vertical-text¹
  • move
  • no-drop
  • not-allowed
  • all-scroll
  • col-resize²
  • row-resize²
  • other resize cursors
  • -webkit-zoom-in
  • -webkit-zoom-out

    1. Does not alias properly (displays black on black)
    2. Displays incorrectly (as ns-resize or ew-resize)

The following, however, simply revert to auto or default, depending on the case:

  • none
  • context-menu¹
  • cell
  • alias
  • copy
  • custom url() cursors
  • -webkit-zoom-grab
  • -webkit-zoom-grabbing

    1. Forgivable, as it is not supported by Webkit

This is quite disturbing for me, as one of the cases I had in mind for my application would require me to hide the cursor. Custom cursors would also be useful for this purpose, as I could set a transparent image as the cursor. However, neither seem to be able to be used.

Does anyone have explanation of why a seemingly arbitrary selection of cursors are not supported, or how I might hide the cursor?

Thanks!

4

1 回答 1

2

我不确定为什么只有一部分选项可用。我会责怪过时的 webkit 版本,但它并没有完全解释。

正如您所提到的,通过透明图像(1x1 透明 .png)隐藏光标似乎可以使用以下方法正常工作:

* {
    cursor: url(image.png), auto;
}

您可能想要更具体地定位某些东西(也许?)。我使用星选择器只是为了演示目的:)

于 2013-11-24T01:57:44.557 回答