В таблицата е показано списък с възможните икони.
Икона | Стойност | Примерен код | Браузер |
auto | Всички | ||
![]() | default | style="cursor: default;" | Всички |
![]() | hand | style="cursor: hand;" | IE |
![]() | pointer | style="cursor: pointer;" | NS6/ IE6 |
![]() | hand & pointer | style="cursor: pointer; cursor: hand;" | Cross browser |
![]() | crosshair | style="cursor: crosshair;" | Всички |
![]() | text | style="cursor: text;" | Всички |
![]() | wait | style="cursor: wait;" | Всички |
![]() | help | style="cursor: help;" | Всички |
Всички | |||
![]() | move | style="cursor: move;" | Всички |
![]() | e-resize | style="cursor: e-resize;" | Всички |
![]() | ne-resize | style="cursor: ne-resize;" | Всички |
![]() | nw-resize | style="cursor: nw-resize;" | Всички |
![]() | n-resize | style="cursor: n-resize;" | Всички |
![]() | se-resize | style="cursor: se-resize;" | Всички |
![]() | sw-resize | style="cursor: sw-resize;" | Всички |
![]() | s-resize | style="cursor: s-resize;" | Всички |
![]() | w-resize | style="cursor: w-resize;" | Всички |
![]() | progress | style="cursor: progress;" | IE6 |
![]() | all-scroll | style="cursor: all-scroll;" | IE6 |
![]() | col-resize | style="cursor: col-resize;" | IE6 |
![]() | no-drop | style="cursor: no-drop;" | IE6 |
![]() | not-allowed | style="cursor: not-allowed;" | IE6 |
![]() | row-resize | style="cursor: row-resize;" | IE6 |
![]() | url(uri) | style="cursor: url(mycursor.cur);" Забележка: Поддържа се само .cur и .ani файлови формати, поддържа се от IE6. | IE6 |
![]() | vertical-text | style="cursor: vertical-text;" | IE6 |
Ето няколко примера за начина по който може да се използва:
Пример #1:
Това ще промени стрелката на цялата страница с иконата mycursor.cur.
Пример #2:
Във втория пример когато мишката е в/у целия DIV иконата е
Help
Ако горните примери на помогнат, може да смените курсора с помощта на JavaScript. Просто използвайте синтаксиса :
element.style.cursor="new_cursor_value"
Пример #3 (невъзможност за избиране на текста):
В този пример ще видите как да направите текста невъзможен за избиране. (в IE5+). Когато мишката минава над текста и се опитва да го селектира излиза иконата: .
onMouseup="this.style.cursor='default'">
body { cursor: Cursor_Shoot.cur (Cursor_Shoot.cur); }
Това е благодаря предварително .