Как изменить курсор на вашем сайте

Изменение значка курсора на сайте – довольно интересная идея, это поможет сделать ваш сайт уникальным и запоминающимся.

Шаг 1: Создайте сами или скачайте значок курсора

Для того, чтобы курсор был совместим со всеми браузерами, вам нужно, чтобы файл значка имел расширение “.CUR“. Вы можете сделать это с помощью программы “Cursor Editor”, которую вы можете скачать бесплатно, или воспользоваться онлайн сервисом.

К сожалению, для совместимости, максимальный размер 32px 32px х.

Шаг 2: Добавьте ваш .CUR файл на веб-хостинг

Вы не сможете загрузить файл .CUR через WordPress, поэтому, вам нужно загрузить его непосредственно на ваш веб-хостинг с помощью любого FTP-клиента (программы для передачи файлов), например FileZilla . Запомните путь к фалу курсора, потому что вы должны будете ссылаться на него в следующем шаге.

Шаг 3: Вставьте этот код в ваш CSS файл

body {cursor: url('http://YOUR .CUR URL'), auto;}

Если вы хотите, что бы изображение курсора изменялось при наведении на ссылку, загрузите ещё один  “.CUR” файл и добавьте этот код сразу после предыдущего:

a {cursor: url('http://YOUR .CUR URL #2'), auto;}

Стандартные значения курсора приведены в таблице.

Вид курсора

Вид	Название		Значение
	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}

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

Теперь вы можете произвести впечатление на своих клиентов и посетителей сайта с помощью необычного курсора мыши!