Свои курсоры на сайте

Свои курсоры на сайте

Каскадные таблицы стилей (CSS) позволяют изменять вид практически любого элемента веб-страницы, так же это относится и к курсорам. Можно изменять не только состояние курсора (переместить, подождите и т.д.), но и использовать свои собственные курсоры. Они будут динамически подгружаться браузером и отображаться при наведении на определенные вами элементы страницы. В соответствии с тематикой вашего сайта, и вашими предпочтениями, можно изменить стандартный курсор пользователя на любой который вам подойдет.

Значения CSS-атрибута cursor

CSS-атрибут cursor может принимать значения, приведенные в таблице. Вы можете посмотреть на работу данного атрибута в вашем браузере, поместив курсор в соответствующей ячейке таблицы напротив значения, которое вы хотите просмотреть.
ВидCSS-кодПримерБраузер
cursor: default;все
cursor: hand;IE
cursor: pointer;все
cursor: crosshair;все
cursor: text;все
cursor: wait;все
cursor: help;все
cursor: move;все
cursor: e-resize;все
cursor: w-resize;все
cursor: ne-resize;все
cursor: sw-resize;все
cursor: nw-resize;все
cursor: se-resize;все
cursor: n-resize;все
cursor: s-resize;все
cursor: progress;все
cursor: all-scroll;все
cursor: col-resize;все
cursor: no-drop;все
cursor: not-allowed;все
cursor: row-resize;все
cursor: vertical-text;все
cursor: url(/style/cursor.cur), pointer;IE, Firefox,
Google Chrome

Примеры CSS кода

Приведенный ниже код указывает браузеру, что он должен отобразить курсор со знаком вопроса при наведении на ссылку:
<a href="/help.php" style="cursor: help;">Помощь</a>

Следующий пример указывает браузеру, что он должен использовать при наведении на ссылку вместо стандартного курсора файл cursor.cur, расположенный на вашем сайте.
<a href="/link.php" style="cursor: url(/style/cursor.cur), pointer;">Ссылка</a>

Заключение

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

0 коментарі:

Отправить комментарий

 
Анализ сайта booksrum.blogspot.com Яндекс.Метрика