Primero, estoy construyendo un sitio web sobre carga. Hay un editor de html, pero no creo que funcione tan bien junto con el propio creador de sitios.
Quiero que mi imagen personalizada cambie la imagen del cursor del mouse mientras se hace clic. Tengo tres problemas aquí:
¡Aquí tienes! Es bastante simple de hacer:
Simplemente escriba la propiedad del cursor en el selector que desee, para todo el html {...} , por supuesto.
html { background-color: lightgray; cursor: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/9632/happy.png"), auto; } <html> </html>También hay muchos cursores predeterminados: puede consultarlos aquí: https://codepen.io/chriscoyier/pen/uCwfB
Simplemente usaría una combinación de CSS y JavaScript.
Clase CSS que declara la definición de cursor adecuada con una palabra clave alternativa. Luego agregue un evento onmousedown simple para activar la adición de una segunda clase CSS que declara una definición de cursor anulada. Agregue un segundo evento onmouseout para eliminar la segunda clase que se agregó al hacer clic.
/* keyword fallback example: use pointer, if hand.png doesn't exist */ .cursor-hand { cursor: url(hand.png), pointer; }