Свой курсор на сайте с помощью CSS

Свой курсор на сайте с помощью CSS

29.04.201623941sima

Сегодня практически все браузеры поддерживают смену курсора. В этом материале о том, как поменять курсор на сайте с помощью CSS. Делается это с помощью параметра cursor

Смена курсора нужна для большей степени атмосферности сайта, Если это сайт онлайн-игры, сайт рекламного агентства и т.д., то долю креатива можно внести и здесь. Какой формат нужен для курсора на сайте? Современные браузеры поддерживают png и cur. Для того, чтобы большее число браузеров поддерживало уникальный курсор, рекомендуется использовать формат cur.

CSS код

Этот код вставьте в свою таблицу стилей (CSS):

Код
body {cursor: url('http://yraaa.ru/_ld/4/411_cursor.cur'), auto}

Здесь курсор применен для всего документа, но вы можете вместо body задать любую другую секцию на сайте, просто пропишите ID или класс блока.

Такая последовательность получается:

  1. Создаем курсор или находим в интернете в формате cur;
  2. Загружаем его на сайт;
  3. Пишем код в CSS с указанием ссылки на курсор.

Итак, вот пример того, что у нас получилось:

Наведите на этот блок, чтобы увидеть пример в действии.
Если курсор не изменился, значит ваш браузер не поддерживает такой возможности.


Как создать курсор?

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

cursors-4u.com – большая база курсоров. Просто выбирайте и скачивайте. Я быстро нашел там курсор в виде отрубленной руки. Это первое, что приходит на ум, вот такой я оригинальный.




Сохраните в социальную сеть
Комментарии (1)
Гость 29.08.2012 в 18:39Спам
супер
1
Чтобы оставить комментарий под этой публикацией,
зарегистрируйтесь или войдите.
Рейтинг лучших сервисов для самостоятельного создания сайта.
Лучшие конструкторы
Легко! Если пользоваться нашими советами.
Создать сайт