Как сделать перекрестие вместо курсора в играх
Добавил пользователь Дмитрий К. Обновлено: 19.09.2024
Такие же образы может приобретать курсор мыши и при работе в браузере при просмотре различных веб страниц. Это возможно благодаря каскадным таблицам стилей, которые предоставляют нам такую замечательную возможность как изменение курсора мыши при наведении его на элементы html страницы.
Курсор мыши можно поменять с помощью правила css cursor, которое позволяет установить форму курсора мыши при наведении его на данный элемент веб-страницы. Этот атрибут можно применять к любому элементу веб страницы, будь это строчный или блочный элемент.
Если посмотреть спецификацию css, то вы заметите, что возможных значений у атрибута cursor довольно много:
Большинство значений на практике применяется довольно редко. По умолчанию для свойста cursor применяется значение auto. В этом случае браузер отображает курсор по умолчанию для текущего элемента. Например, при наведении на ссылку курсор приобретает форму руки, в тексте показывается обычный текстовый курсор, а на пустых местах простая стрелочка.
| Значение | Вид | Пример |
|---|---|---|
| default | P | |
| none | P | |
| context-menu | P | |
| help | P | |
| pointer | P | |
| progress | P | |
| wait | P | |
| cell | P | |
| crosshair | P | |
| text | P | |
| vertical-text | P | |
| alias | P | |
| copy | P | |
| move | P | |
| no-drop | P | |
| not-allowed | P | |
| e-resize | P | |
| n-resize | P | |
| ne-resize | P | |
| nw-resize | P | |
| s-resize | P | |
| se-resize | P | |
| sw-resize | P | |
| w-resize | P | |
| ew-resize | P | |
| ns-resize | P | |
| nesw-resize | P | |
| nwse-resize | P | |
| col-resize | P | |
| row-resize | P | |
| all-scroll | P |
Некоторые значения для css правила cursor перечисленные выше могут не работать в различных браузерах. Особенно часто проблемы возникают с Оперой, иногда что то может не работать в браузерах Mozila Firefox и Chrome. Установленный по умолчанию в операционной системе Windows браузер Internet Explorer поддерживает все значения.
С помощью правила cursor также можно задать свой собственный курсор, задав путь к соответствующей картинке. Расширение файла картинки с курсом обычно бывает .cur. Кроме формата CUR Internet Explorer в качестве формата файла курсора поддерживает еще и формат ANI. А Firefox, Chrome и Safari кроме CUR поддерживают еще форматы PNG, GIF и JPG.
При указании своего собственного курсора синтаксис правила немного меняется. Через запятую перечисляется одно или несколько значений url, а последним значением обязательно должно быть одно из ключевых слов:
cursor: url ('адрес картинки 1'), url ('адрес картинки 2'), .
При таком стилевом правиле браузер сначала попытается открыть первый файл с курсором, а если открыть его не по каким-либо причинам не удается, перейдет к следующему файлу и так далее. Кстати, для этого абзаца я настроил нестандартный курсор. Поэтому при наведении на него мышкой, если ваш браузер поддерживает формат файла, курсор будет меняться. Чтобы достигнуть такого эффекта достаточно такой записи:
Вообще CSS правило Cursor веб-мастера применяю довольно редко, чтобы не вводить пользователя в заблуждение. Прежде чем переделать вид курсора, определите, будет ли это изменение к месту. Ведь, допустим, что может подумать пользователь, если вместо традиционной руки, появляющейся при наведении на ссылку, возникнет что-то другое.
На этом о курсорах все. Не забудьте подписаться на обновления блога и буду благодарен если воспользуетесь кнопочками социальных сетей:
Здравствуйте!
Вообще, сам я немного скептически смотрю на замену курсора (кроме отдельных случаев: когда он сливается с фоном или слишком мелкий, например) , но вопросов таких получаю массу. 😉
Сегодня решил набросать небольшую заметку с парочкой простых способов сделать это (покажу, как обычную стрелку "превратить" во что-то более оригинальное).
Кстати, для тех кто хочет немного позаниматься "творчеством" — есть вариант создать свой курсор (благо, это доступно большинству, причем, даже если вы совсем не умеете рисовать).
Пример - на что можно поменять стрелку.
Настройка курсора
Замена стандартной стрелки-курсора на что-то иное
Вариант 1 (штатный)
Если у вас установлена современная обновленная версия Windows 10 — то в арсенале ее функций есть возможность поменять курсор. Выбор, конечно, не самый большой — но есть!
Как это делается:
- зайти в параметры ОС (сочетание Win+i / либо через меню ПУСК);
- перейти в раздел "Специальные возможности / указатель мыши" ;
- задать размер указателя, и выбрать его цвет (кое-какие варианты есть 👌).
Windows 10 — указатель мышки
Вариант 2 (универсальный)
Сейчас в сети можно найти сотни и тысячи самых разных курсоров — что называется на любой вкус. В рамках этой заметке я предложу свой "старый" архив (ссылка ниже 👇. В нем собраны сотни разных курсоров, думаю, что для первого знакомства это должно хватить 😉).
- загружаем архив с курсорами;
- копируем его в папку "C:\Windows\Cursors" и извлекаем всё, что в нем есть (архиваторы в помощь);
- нажимаем Win+R и используем команду control mouse ;
- должны открыться настройки мышки. В разделе "Указатели" выбираем основной режим и нажимаем "Обзор" ;
Свойства мышки — выбор указателя
Выбор указателя для справки
Как создать свой курсор
Для этого лучше и легче всего использовать спец. программу - ArtCursors . По своему внешнему виду — она очень напоминает стандартный Paint.
Единственное отличие : поле, на котором вы будете рисовать курсор (указатель), представляет из себя прямоугольник, разделенный на небольшие квадратики (пиксели). Слева (справа) представлены инструменты, которыми и можно "творить" свой шедевр. 👌 👇
ArtCursors
Создаем свой курсор в ArtCursors
ArtCursors позволяет нарисованную картинку сразу же сохранить в формат ".CUR". А ее потом достаточно разместить в папку "C:\Windows\Cursors" и выбрать в настройках курсора (как мы это делали чуть выше. ).
И будет "бегать" по экрану свой рисунок (вместо стандартной стрелки).
Что у меня получилось!
Кстати, эта программа позволяет "побаловаться" не только с курсорами, но и другими иконками Windows. Но в рамках этой статьи на этом не останавливаюсь.
Что дает проф. версия программы
Как сбросить все настройки по изменению курсора
👉 Способ 1
Необходимо открыть настройки мышки: нажать Win+R и в окне "Выполнить" использовать команду control mouse .
Далее в открывшемся окне перейти во вкладку "Указатели" , выбрать "Основной режим" и нажать кнопку "По умолчанию" . См. скриншот ниже. 👇
Задать курсор по умолчанию
👉 Способ 2
Еще один хороший способ изменить курсор (да и вообще оформление ОС) — установить новую тему (которая включает в себя всё сразу: обои, цвет, звуки, указатель и пр.).
Сделать это можно в параметрах ОС (сочетание Win+i) в разделе "Персонализация / темы" .
Меняем тему / Windows 10
👉 Способ 3
В некоторых случаях (например, когда вы использовали какие-то спец. утилиты) способ 1/2 может не сработать.
Тогда можно попробовать откатить систему (если, конечно, у вас сохранилась хотя бы одна точка восстановления).
Для просмотра точек восстановления:
- нажмите Win+R (чтобы появилось окно "Выполнить"),
- используйте команду rstrui .
Как видите из примера ниже — в моей ОС есть только одна точка (впрочем, этого достаточно для восстановления системы).
👉 В помощь!
Как работать с точками восстановления в Windows 10 - подробная инструкция
Есть только одна точка.
Если точек для отката ОС нет — то восстановить норм. работу Windows можно через сброс параметров и настроек (в дефолтные). Сейчас Windows 10 предлагает это сделать через меню "Обновление и безопасность / Восстановление" .
Такие же образы может приобретать курсор мыши и при работе в браузере при просмотре различных веб страниц. Это возможно благодаря каскадным таблицам стилей, которые предоставляют нам такую замечательную возможность как изменение курсора мыши при наведении его на элементы html страницы.
Курсор мыши можно поменять с помощью правила css cursor, которое позволяет установить форму курсора мыши при наведении его на данный элемент веб-страницы. Этот атрибут можно применять к любому элементу веб страницы, будь это строчный или блочный элемент.
Если посмотреть спецификацию css, то вы заметите, что возможных значений у атрибута cursor довольно много:
Большинство значений на практике применяется довольно редко. По умолчанию для свойста cursor применяется значение auto. В этом случае браузер отображает курсор по умолчанию для текущего элемента. Например, при наведении на ссылку курсор приобретает форму руки, в тексте показывается обычный текстовый курсор, а на пустых местах простая стрелочка.
| Значение | Вид | Пример |
|---|---|---|
| default | P | |
| none | P | |
| context-menu | P | |
| help | P | |
| pointer | P | |
| progress | P | |
| wait | P | |
| cell | P | |
| crosshair | P | |
| text | P | |
| vertical-text | P | |
| alias | P | |
| copy | P | |
| move | P | |
| no-drop | P | |
| not-allowed | P | |
| e-resize | P | |
| n-resize | P | |
| ne-resize | P | |
| nw-resize | P | |
| s-resize | P | |
| se-resize | P | |
| sw-resize | P | |
| w-resize | P | |
| ew-resize | P | |
| ns-resize | P | |
| nesw-resize | P | |
| nwse-resize | P | |
| col-resize | P | |
| row-resize | P | |
| all-scroll | P |
Некоторые значения для css правила cursor перечисленные выше могут не работать в различных браузерах. Особенно часто проблемы возникают с Оперой, иногда что то может не работать в браузерах Mozila Firefox и Chrome. Установленный по умолчанию в операционной системе Windows браузер Internet Explorer поддерживает все значения.
С помощью правила cursor также можно задать свой собственный курсор, задав путь к соответствующей картинке. Расширение файла картинки с курсом обычно бывает .cur. Кроме формата CUR Internet Explorer в качестве формата файла курсора поддерживает еще и формат ANI. А Firefox, Chrome и Safari кроме CUR поддерживают еще форматы PNG, GIF и JPG.
При указании своего собственного курсора синтаксис правила немного меняется. Через запятую перечисляется одно или несколько значений url, а последним значением обязательно должно быть одно из ключевых слов:
cursor: url ('адрес картинки 1'), url ('адрес картинки 2'), .
При таком стилевом правиле браузер сначала попытается открыть первый файл с курсором, а если открыть его не по каким-либо причинам не удается, перейдет к следующему файлу и так далее. Кстати, для этого абзаца я настроил нестандартный курсор. Поэтому при наведении на него мышкой, если ваш браузер поддерживает формат файла, курсор будет меняться. Чтобы достигнуть такого эффекта достаточно такой записи:
Вообще CSS правило Cursor веб-мастера применяю довольно редко, чтобы не вводить пользователя в заблуждение. Прежде чем переделать вид курсора, определите, будет ли это изменение к месту. Ведь, допустим, что может подумать пользователь, если вместо традиционной руки, появляющейся при наведении на ссылку, возникнет что-то другое.
На этом о курсорах все. Не забудьте подписаться на обновления блога и буду благодарен если воспользуетесь кнопочками социальных сетей:
Как мне вернуть свой курсор по умолчанию на настраиваемый курсор?
- Щелкните на шаре запуска Windows, введите мышь и выберите мышь.
- Перейдите на вкладку указателей, и внизу вы должны увидеть, разрешить темам изменять указатели мыши, снимите флажок и нажмите ОК.
- Попробуйте применить свою собственную мышь и посмотрите, вернет ли ваша мышь после перезапуска к мыши по умолчанию.
Безопасен ли пользовательский курсор?
Softpedia гарантирует, что Пользовательский курсор на 100% чистый. Этот программный продукт был тщательно протестирован и был признан абсолютно чистым; следовательно, любой пользователь компьютера может установить его, не беспокоясь о нем.
Как получить собственный курсор в Windows 10?
Как увеличить размер курсора?
Читайте также: