Скрыть курсор в Chrome (и IE) - PullRequest
       68

Скрыть курсор в Chrome (и IE)

18 голосов
/ 14 апреля 2010

У меня есть следующий CSS, который скрывает курсор мыши для чего-либо на веб-странице. Он отлично работает в Firefox, но в IE и Chrome не работает.

html {
    cursor: none;
}

В Chrome я всегда вижу указатель мыши. В IE, однако, я вижу, какой курсор был последним «активным», когда он выходил на экран. Предположительно он сохраняет последний выбор, а не удаляет его.

Ответы [ 6 ]

22 голосов
/ 14 апреля 2010

Это свойство cursor:none; не является частью стандарта

См. Здесь Свойства CSS курсора w3c .

Возможно, вы захотите скрыть это с помощью Javascript или JQuery.

Кроме того, посмотрите на пустые файлы курсора здесь .

И последняя ссылка на решение ajax .

У Chrome возникла эта проблема с момента его создания, были отправлены сообщения людям на Chromium , и я предполагаю, что они работают над этим.

Кроме того, не верьте, что что-то будет работать в IE. Когда-либо. : P

11 голосов
/ 16 июля 2010

У меня была такая же проблема в эти дни и я нашел хорошее решение, чтобы скрыть указатель в Google Chrome.

Это определение W3C свойства url:

Запятая, разделенная URL-адресами на пользовательские курсоры. Примечание: всегда указывайте универсальный курсор в конце списка, в случае, если ни один из URL не определен можно использовать курсоры

Таким образом, вы можете определить URL для не полностью прозрачного изображения, за которым следует указатель по умолчанию:

cursor: url(img/almost_transparent.png), default;

Если вы выберете полностью прозрачный png, Chrome вместо этого отобразит черный прямоугольник, но если вы выберете png с непрозрачностью не менее 1 пикселя, он будет работать, и никто не заметит указатель.

7 голосов
/ 28 ноября 2012

Найти что-то, что работает в браузерах, - боль.

Код ниже работает на Chrome, IE и Firefox. IE любит файлы .cur, Chrome нравится встроенный png, и некоторые браузеры на самом деле уважают их:)

div {
    cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjbQg61aAAAADUlEQVQYV2P4//8/IwAI/QL/+TZZdwAAAABJRU5ErkJggg=='),
    url(images/blank.cur),
    none;
}
0 голосов
/ 19 декабря 2014

В css: * { cursor: url(cursor.png), none !important }

0 голосов
/ 01 июля 2013

Так что лучший способ справиться с этим сейчас - это API-интерфейс блокировки указателя.

https://developer.mozilla.org/en-US/docs/WebAPI/Pointer_Lock

Он будет скрывать курсор мыши, но также даст вам доступ к данным о движении мыши.

0 голосов
/ 21 апреля 2010

Используйте скрытый апплет с классом java.awt.robot, чтобы переместить курсор за пределы экрана. Скажем, самый нижний левый угол.

...