Properti kursor gaya
Contoh
Ubah kursor:
document.getElementById("demo").style.cursor = "pointer";
Definisi dan Penggunaan
Properti kursor menetapkan atau mengembalikan jenis kursor yang akan ditampilkan untuk penunjuk tetikus.
Dukungan Peramban
| Property | |||||
|---|---|---|---|---|---|
| cursor | Yes | Yes | Yes | Yes | Yes |
Sintaksis
Kembalikan properti kursor:
object.style.cursor
Setel properti kursor:
object.style.cursor = value
Nilai properti
| Value | Description |
|---|---|
| alias | The cursor indicates an alias of something is to be created |
| all-scroll | The cursor indicates that something can be scrolled in any direction |
| auto | Default. The browser sets a cursor |
| cell | The cursor indicates that a cell (or set of cells) may be selected |
| context-menu | The cursor indicates that a context-menu is available |
| col-resize | The cursor indicates that the column can be resized horizontally |
| copy | The cursor indicates something is to be copied |
| crosshair | The cursor render as a crosshair |
| default | The default cursor |
| e-resize | The cursor indicates that an edge of a box is to be moved right (east) |
| ew-resize | Indicates a bidirectional resize cursor |
| help | The cursor indicates that help is available |
| move | The cursor indicates something is to be moved |
| n-resize | The cursor indicates that an edge of a box is to be moved up (north) |
| ne-resize | The cursor indicates that an edge of a box is to be moved up and right (north/east) |
| nesw-resize | Indicates a bidirectional resize cursor |
| ns-resize | Indicates a bidirectional resize cursor |
| nw-resize | The cursor indicates that an edge of a box is to be moved up and left (north/west) |
| nwse-resize | Indicates a bidirectional resize cursor |
| no-drop | The cursor indicates that the dragged item cannot be dropped here |
| none | No cursor is rendered for the element |
| not-allowed | The cursor indicates that the requested action will not be executed |
| pointer | The cursor is a pointer and indicates a link |
| progress | The cursor indicates that the program is busy (in progress) |
| row-resize | The cursor indicates that the row can be resized vertically |
| s-resize | The cursor indicates that an edge of a box is to be moved down (south) |
| se-resize | The cursor indicates that an edge of a box is to be moved down and right (south/east) |
| sw-resize | The cursor indicates that an edge of a box is to be moved down and left (south/west) |
| text | The cursor indicates text that may be selected |
| URL | A comma separated list of URLs to custom cursors. Note: Always specify a generic cursor at the end of the list, in case none of the URL-defined cursors can be used |
| vertical-text | The cursor indicates vertical-text that may be selected |
| w-resize | The cursor indicates that an edge of a box is to be moved left (west) |
| wait | The cursor indicates that the program is busy |
| zoom-in | The cursor indicates that something can be zoomed in |
| zoom-out | The cursor indicates that something can be zoomed out |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Detail Teknis
| Nilai Bawaan: | mobil |
|---|---|
| Nilai Kembali: | Sebuah String, mewakili kursor mouse yang ditampilkan saat pointer mouse berada di atas suatu elemen |
| Versi CSS | CSS2 |
Lebih Banyak Contoh
Contoh
Tampilkan semua kursor yang tersedia:
var whichSelected = x.selectedIndex;
document.body.style.cursor = x.options[whichSelected].text;
Contoh
Kembalikan jenis kursor:
alert(document.getElementById("demo").style.cursor);
Halaman Terkait
Referensi CSS: properti kursor
Objek Gaya