Nuevos Cursores con CSS3

diciembre 12, 2012 | Html5 & Css3

Les presento una variedad de cursores para que puedan considerar en sus proximos proyectos que realicen, pero lamentable mente la vista de cada cursor de penderá del sistema operativo que sus usuarios estén usando, todos funcionan muy bien en windows es lo que he podido ver y obviamente también de penderá de navegador que esten usando,  aqui les traigo un sin fin de cursores desde css2, css3, propios de navegadores y cursores personalizados que se pueden hacer con una imgen, en la parte inferior puse un link para que puedar visualizar los cursores en vivo.

Cursores con CSS3 (IE9+, FireFox 3.5+, Chrome, Safari, Opera 9+):

cursor: none;
cursor: context-menu;
cursor: cell;
cursor: vertical-text;
cursor: alias;
cursor: copy;
cursor: no-drop;
cursor: not-allowed;
cursor: ew-resize;
cursor: ns-resize;
cursor: nesw-resize;
cursor: nwse-resize;
cursor: col-resize;
cursor: row-resize;
cursor: all-scroll;

Cursores con CSS2

cursor: auto;
cursor: inherit;
cursor: crosshair;
cursor: default;
cursor: help;
cursor: move;
cursor: pointer;
cursor: progress;
cursor: text;
cursor: wait;
cursor: e-resize;
cursor: ne-resize;
cursor: nw-resize;
cursor: n-resize;
cursor: se-resize;
cursor: sw-resize;
cursor: s-resize;
cursor: w-resize;

Propios de Firefox Mozilla, Chrome y Safari):

cursor: -webkit-grab;
cursor: -moz-grab;
cursor: -webkit-grabbing;
cursor: -moz-grabbing;
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
cursor: -webkit-zoom-out;
cursor: -moz-zoom-out;

Tu Propio Cursor Personalizado

cursor: url(images/cursor.png), default;

Ver Demo Online

Relacionados