cursor

Internet Explorer

Google Chrome

Opera

Safari

Firefox

6.07.08.0 2.03.04.0 9.29.610 2.03.14.0 2.03.03.6
                   
CSS 1CSS 2CSS 2.1CSS 3
    

Описание CSS свойства:

Устанавливает форму курсора, когда он находится в пределах элемента. Вид курсора зависит от операционной системы и установленных параметров.

Прежде чем воспользоваться возможностью переделать вид курсора, решите, а будет ли он использоваться к месту. Многих пользователей подобные изменения могут ввести в заблуждение, когда, например, вместо традиционной руки, появляющейся при наведении на ссылку, возникает нечто другое. В большинстве случаев, лучше оставить все как есть.

Краткая информация:
Значение по умолчанию: auto
Наследуется: Да
Применяется: Ко всем элементам
Ссылка на спецификацию: http://www.w3.org/TR/CSS21/ui.html#cursor-props

Синтаксис CSS свойства:

cursor: [url('путь к курсору')] | [ auto | crosshair | default | e-resize | help | move | n-resize | ne-resize | nw-resize | pointer | progress | s-resize | se-resize | sw-resize | text | w-resize | wait | inherit ]

Значения CSS свойства:

url - Позволяет установить свой собственный курсор, для этого нужно указать путь к файлу, в котором указана форма курсора, в формате CUR или ANI.

auto - Вид курсора по умолчанию для текущего элемента.

inherit - Наследует значение родителя.

Остальные допустимые значения приведены в таблице ниже:


Вид Значение   Пример
default   P {cursor:default}
crosshair   P {cursor:crosshair}
help   P {cursor:help}
move   P {cursor:move}
pointer   P {cursor:pointer}
progress   P {cursor:progress}
text   P {cursor:text}
wait   P {cursor:wait}
n-resize   P {cursor:n-resize}
ne-resize   P {cursor:ne-resize}
e-resize   P {cursor:e-resize}
se-resize   P {cursor:se-resize}
s-resize   P {cursor:s-resize}
sw-resize   P {cursor:sw-resize}
w-resize   P {cursor:w-resize}
nw-resize   P {cursor:nw-resize}

В зависимости от операционной системы и ее настроек вид курсора может отличаться от приведенных в таблице.


Объектная модель CSS свойства:

[window.]document.getElementById("elementID").style.cursor

Особенности отображения в браузерах:

Некоторые браузеры поддерживают дополнительные формы курсоров. Например, Internet Explorer и Opera работает со значением hand, которое является аналогом значения pointer. Кроме того, в браузерах IE, Safari, Chrome и Firefox будут действовать следующие значения: all-scroll, col-resize, no-drop, not-allowed, row-resize, vertical-text. Учтите, что указанные значения не входят в спецификацию CSS 2.1, но соответствуют спецификации CSS 3 (кроме hand).

Браузер Safari, Opera, Firefox и Google Chrome не поддерживают значение url.


Баннер SGU.RU