[HTML][BASICO] Como cambiar el cursor por uno personalizado (Explicado)

  • 2 Respuestas
  • 2893 Vistas

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado elshotta

  • *
  • Underc0der
  • Mensajes: 105
  • Actividad:
    6.67%
  • Reputación 0
    • Ver Perfil
Hola a todos
ahora les mostrare como poner un cursor personalizado en tu web con css
 ;D
bueno pondre un codigo fuente para mayor comodidad
Código: HTML5
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2. "http://www.w3.org/TR/html4/strict.dtd"
  3. >
  4. <Solo los usuarios pueden ver los links. Registrate o Ingresar lang="en">
  5. <Solo los usuarios pueden ver los links. Registrate o Ingresar>
  6. <Solo los usuarios pueden ver los links. Registrate o Ingresar>Utilizo un cursor personalizado</Solo los usuarios pueden ver los links. Registrate o Ingresar>
  7. <Solo los usuarios pueden ver los links. Registrate o Ingresar type="text/css">
  8. body {
  9. cursor: url(nat870.cur), pointer;
  10. }
  11.  
  12. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
  13.  
  14. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
  15. <Solo los usuarios pueden ver los links. Registrate o Ingresar>
  16. <Solo los usuarios pueden ver los links. Registrate o Ingresar style="height: 600px; background: #ffdd99; padding: 20px;">
  17. <Solo los usuarios pueden ver los links. Registrate o Ingresar>Trabajar con cursores personalizados</Solo los usuarios pueden ver los links. Registrate o Ingresar>
  18. <Solo los usuarios pueden ver los links. Registrate o Ingresar>
  19. Pasa el ratón por cualquier parte del cuerpo de la página, para ver el cursor personalizado que se a colocado. <Solo los usuarios pueden ver los links. Registrate o Ingresar>
  20.  
  21.  
  22. <Solo los usuarios pueden ver los links. Registrate o Ingresar>
  23.  
  24. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
  25. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
  26. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
  27. </Solo los usuarios pueden ver los links. Registrate o Ingresar>
EXPLICACION

ok nos concentraremos en esta parte
Código: CSS
  1. body {
  2. cursor: url(nat870.cur), pointer;
  3. }
  4.  
  5. </style>

vemos que dice nat870.cur, ese es el cursor que ponemos "que remplaza la flechita de siempre xD". El navegador intentará colocar como cursor en el cuerpo de la página la "nat870.cur" y si no es compatible con ese tipo de archivo gráfico en el cursor, colocara el predeterminado tipo "pointer" que es la típica flecha del ratón.

Bueno no tiene mucha ciencia
Aca les dejo una web para descargar los cursores
Solo los usuarios pueden ver los links. Registrate o Ingresar
eligen uno, lo descargan y solo lo cambian por el nat870.cur

espero que les sirva xD
saludos  :)
« Última modificación: Mayo 06, 2014, 03:37:55 pm por Destructor.cs »

Conectado ANTRAX

  • *
  • Administrator
  • Mensajes: 5635
  • Actividad:
    56.67%
  • Country: ar
  • Reputación 37
  • ANTRAX
  • Skype: underc0de.org
  • Twitter: @Underc0de
    • Ver Perfil
    • Underc0de
    • Email
Muy buena bro! hoy dia cambiamos el cursor del foro por el de la cruz!


Desconectado elshotta

  • *
  • Underc0der
  • Mensajes: 105
  • Actividad:
    6.67%
  • Reputación 0
    • Ver Perfil
ajajaj si se ve
bien el foro haci  ;D ;D
saludos

 

Como instalar el diccionario para corrección ortográfica en español en Notepad++

Iniciado por graphixx

Respuestas: 0
Vistas: 3898
Último mensaje Julio 18, 2018, 04:25:23 am
por graphixx
Así puedes usar Google Drive como un servidor FTP gratuito

Iniciado por Dragora

Respuestas: 0
Vistas: 861
Último mensaje Agosto 27, 2019, 02:59:09 pm
por Dragora
[SOURCE] Libreria para tu propia NUBE como MEGA

Iniciado por graphixx

Respuestas: 4
Vistas: 3595
Último mensaje Marzo 21, 2017, 01:40:16 pm
por 79137913
Como colocar caja de comentarios de Facebook en Blogger en 3 pasos

Iniciado por ANTRAX

Respuestas: 1
Vistas: 2433
Último mensaje Junio 21, 2015, 08:53:48 pm
por Yavi
Internet & World Wide Web Como Programar, 5ta Edición - Deitel

Iniciado por D3ivid

Respuestas: 1
Vistas: 3162
Último mensaje Febrero 24, 2015, 05:40:40 pm
por Hu3c0