{cursor} Cursor Property | CSS: Presentation Layer

Standards Based Development

The cursor property specifies the type of cursor that should be displayed for the pointing device when over an element's border, padding, and content.

cursor

Cursor Image Types

A static cursor is saved as a .cur file; an animated cursor is saved as .ani file.

Cursor mime Media Type

WebKit browsers may have problem(s) rendering cursor's using images, resulting in an error message similar to this:

Resource interpreted as Image but transferred with mime type application/octect-stream

. Adding the following to .htaccess will resolve this error:

AddType image/vnd.microsoft.icon .cur .ico

Cursor Mime Media Type

WebKit cursor Values

WebKit defines four constants for cursor that can be used as keyword values:

• -webkit-grab defines the cursor as an open hand, indicating the element can be grabbed, displays onscreen when the pointer is over an element
• -webkit-grabbing defines the cursor as a closed hand, indicating the element has been grabbed, displays onscreen when the pointer is over an element
• -webkit-zoom-in defines a zoom-in cursor, that displays onscreen when the pointer is over an element
• -webkit-zoom;-out defines a zoom-out cursor, that displays onscreen when the pointer is over an element

Examples

• cursor css Demo 01
• Custom cursor css Demo 02
• Custom Cursor Image Files That Can Be Used -> http://dev.bowdenweb.com/a/i/cursors/windows7/
• 

References and Resources

• Safari css Properties
• User Interface - Safari css Properties