Рейтинг сайтов+Белый каталог
IFtraf.RU (iFrame+GOLD) Премиум Раскрут

Название: Курсоры в CSS

Описание: Вот замутил себе для интереса, решил поделиться с Вами Живой пример поводите курсором по сайту разделам и он будет меняться. http://resume.waper.su/ - ПРИМЕР Полный список значений cursor https://sun9-74.userapi.com/impg/mGe7O7TptzdMDxzpUl2HjNMURrNkmyi7VlpzVQ/-fSGgC9sBuQ.jpg?size=572x905&quality=95&sign=903f96910eae45f7e16fbead5e03669f&type=album можете посмотреть тут по скрину

Установка своего курсора 

Вид курсора можно задать с помощью значения – названия, например курсор со знаком вопроса:

body {
	cursor: help;
}


Все браузеры дают возможность установить элементу свой курсор из файла по URL, например:

body {
	cursor: url('/pointer.cur') 4 1;
}

Вторым параметром задаются координаты активной точки, в которой регистрируется нажатие мыши. По умолчанию это левый верхний угол (0,0).

Браузеры на мобильных устройствах не поддерживают свойство cursor, но при этом в jQuery событие clik не сработает если у элемента нет свойства cursor: pointer.

Кроссбраузерность
Так как, у браузеров разная поддержка форматов фалов курсора:

Internet Explorer в качестве формата файла курсора поддерживает CUR и ANI.
Firefox, Chrome, Safari поддерживают форматы CUR, PNG, GIF, JPG.
У свойства cursor имеется возможность указать несколько курсоров, в приоритете будет первый в списке поддерживаемый формат.

body {
	cursor: 
		url('/pointer.png') 4 1, 
		url('/pointer.cur') 4 1, 
		pointer;
}

Добавил: NEON VIP
Дата: 16 фев 2025, в 11:00 Комментарии (1)