Tengo el siguiente CSS que oculta el cursor del mouse para cualquier cosa en la página web. Funciona perfectamente en Firefox, pero en IE y Chrome, no funciona.Ocultar cursor en Chrome (e IE)
html {
cursor: none;
}
En Chrome, siempre veo el puntero del mouse. En IE, sin embargo, veo el último cursor 'activo' cuando entró en la pantalla. Es de suponer que mantiene la última selección en lugar de eliminarla.
Esta propiedad cursor:none; no es parte del estándar
Vea aquí w3c cursor CSS properties.
Es posible que desee buscar ocultarlo con Javascript o JQuery.
Además, observe los archivos de cursor en blanco here.
Y un último enlace a un ajax solution.
Chrome ha tenido este problema desde que se creó, se han enviado informes a las personas al Chromium, y supongo que están trabajando en ello.
Además, no confíes en que nada funcionaría en IE. Nunca. : P
Use un applet oculto con la clase java.awt.robot para mover el cursor fuera del sreen. Diga la esquina inferior izquierda.
Wow ... No puedo pensar en una forma más difícil y más complicada de lograr una tarea tan simple. – samulisoderlund
I +1 esto. No es una tarea simple. cursor: ninguno; "funciona" en Chrome, pero si hace clic con el botón izquierdo del mouse, el cursor vuelve a aparecer. Si intenta y arrastra, el cursor vuelve a aparecer. Si puede hacer algo como abrir y cerrar el inspector, el cursor vuelve a aparecer. Hay * muchas * formas de recuperarlo. Esta solución es el tipo de cosa que proporciona la eliminación permanente del cursor, si su aplicación lo requiere. –
Tuve el mismo problema en estos días y encontré una buena solución para ocultar el puntero en Google Chrome.
Este es el W3C definition de propiedad url:
una coma separó de URLs personalizadas a cursores. Nota: Siempre especifique un cursor genérico al final de la lista, en caso de que ninguno de los cursores URL definidos pueden usarse
Por lo tanto, se puede definir una URL de la imagen no completamente transparente a, seguido por el puntero por defecto:
cursor: url(img/almost_transparent.png), default;
Si elige un png totalmente transparente, Chrome mostrará un rectángulo negro en su lugar, pero si usted elige un png con al menos no 1px transparente que van a trabajar, y nadie se dará cuenta de la puntero.
Solo para hacerte saber que Chrome admite "cursor: none;" e IE admite cursores totalmente transparentes. Puede usar hojas de estilo específicas del navegador. ;) – trusktr
Gracias por el comentario. En el momento de mi respuesta, Chrome no admitía el cursor: ninguno – alexmeia
Podría hacer que funcione en IE y Edge (a través de browserstack) –
Encontrar algo que funcione en todos los navegadores es un problema.
El siguiente código funciona en Chrome, IE y Firefox. IE le gusta .cur archivos, Chrome le gusta el png incrustado, y algunos navegadores realidad respetar el ningunos :)
div {
cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjbQg61aAAAADUlEQVQYV2P4//8/IwAI/QL/+TZZdwAAAABJRU5ErkJggg=='),
url(images/blank.cur),
none;
}
Así que la mejor manera de lidiar con esto ahora es la API de bloqueo puntero.
https://developer.mozilla.org/en-US/docs/WebAPI/Pointer_Lock
que va a ocultar el cursor del ratón, pero dará acceso a los datos sobre el movimiento del ratón también.
En CSS: * { cursor: url(cursor.png), none !important }
¿Por qué querría hacer tal cosa? – graphicdivine
Porque tengo una pantalla orientada al cliente que no tiene interacción humana. Cuando se inicia el cuadro, se activa automáticamente el navegador web, pero el cursor se inicia automáticamente en el centro de la pantalla, que enmascara parte de la página web. Por lo tanto, debe estar oculto. – Chris
Alternativamente, podría usar otro navegador para su pantalla. Al tocar F11 en la mayoría de los navegadores, se convertirán en pantalla completa. – Kyle