Example 1: css cursor pointer hover
.pointer {
cursor: pointer;
}
Example 2: cursor as image css
You can use own image or emoji as cursor
<style>
a{
cursor: url("custom.gif"), url("custom.cur"), default;
}
</style>
<p>Place your mouse pointer <a href="#">over me</a> to reveal the custom cursor.</p>
Example 3: change the cursor css
cursor: alias
cursor: all-scroll;
cursor: auto;
cursor: cell;
cursor: context-menu;
cursor: col-resize;
cursor: copy;
cursor: crosshair;
cursor: default;
cursor: e-resize;
cursor: ew-resize;
cursor: grab;
cursor: grabbing;
cursor: help;
cursor: move;
cursor: n-resize;
cursor: ne-resize;
cursor: nesw-resize;
cursor: ns-resize;
cursor: nw-resize;
cursor: nwse-resize;
cursor: no-drop;
cursor: none;
cursor: not-allowed;
cursor: pointer;
cursor: progress;
cursor: row-resize;
cursor: s-resize;
cursor: se-resize;
cursor: sw-resize;
cursor: text;
cursor: url(myBall.cur),auto;
cursor: w-resize;
cursor: wait;
cursor: zoom-in;
cursor: zoom-out;
Example 4: css cursor pointer
body {
cursor: url(CURSOR_URL), auto;
}
Example 5: css custom cursor
.custom {
cursor: url(images/my-cursor.png), auto;
}
Comments
Post a Comment