Страница 1 из 11
Архив - только для чтения
Сообщество uCoz » Архивариус » Архив » Курсоры (Как изменить или поставить собственный курсор на сайте)
Курсоры
Модератор форума
Сообщение # 1 | 17:01:38
Вид курсора определяется с помощью CSS свойства cursor.

CSS-свойство cursor позволяет нам устанавливать собственный вид курсора элементам страницы, причем, можно использовать как стандартные виды курсоров, так и курсоры, определенные пользователем (файлы CUR или SVG курсоры).

CSS-свойство cursor - свойство для изменения внешнего вида курсора

Для простоты разделим курсоры на группы...

Стандартные курсоры
auto - курсор по умолчанию для текущего элемента.
crosshair - простое перекрестие (напоминающее символ "+").
default - курсор, используемый по умолчанию на данной платформе. Зачастую представляется в виде стрелки.
pointer - курсор представляется указателем, обозначающим ссылку.
move - курсор, определяющий объект, который можно переместить.
e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize - курсоры, обозначающие возможность перемещения некоторого края объекта.
text - курсор, обозначающий текст, который может быть выделен. Зачастую представляется в виде вертикальной линии "|".
wait - курсор, обозначающий занятость программы, и говорящий пользователю, что следует подождать. Зачастую представляется в виде циферблата или песочных часов.
help - курсор, означающий, что для объекта, на который он указывает, имеется справочная информация. Зачастую представляется в виде вопросительного знака или воздушного шара.

Пример использования:

Code
SPAN.help { cursor : help; }

Курсор определенный пользователем:
Может возникнуть ситуация, когда появится необходисомть в курсоре необычного вида. Тогда следует в качестве значения свойства cursor указать:

url('путь к курсору'), стандартный курсор
Для наглядности приведу примеры:

Code

P { cursor : url("my.cur"), text; }  
P { cursor : url("my.svg"), url("my.cur"), auto; }

Когда браузер встречает определение пользовательского курсора, он пытается отобразить первый курсор из списка. Если первый курсор не может быть отображен, то браузер пытается задействовать следующий по списку курсор. Обратите внимание, что всегда в конце списка пользовательских курсоров указывается какой-то стандартный курсор, на тот случай, если ни один из пользовательских курсоров не сможет быть отображен.

В качестве пользовательского курсора можно использовать файлы в формате CUR, ANI или SVG курсоры. SVG cursor - это платформо-независимый пользовательский курсор, где сам курсор является файлом изображения. Рекомендуется использовать PNG формат, так он поддерживает маску прозрачности через альфа-канал, но можно использовать и GIF, ибо он поддерживает 2-битную прозрачность. Если же используется другой формат изображения, который не поддерживает прозрачность ни через альфа-канал, ни через назначение отдельного цвета в качестве прозрачного, то курсор будет представлен в виде непрозрачной прямоугольной области. Следует также напомнить, что следует использовать в курсоре по меньшей мере два цвета, чтобы он был различим на различном фоне.

Пользовательские курсоры поддерживаются начиная с IE6, Firefox 1.5. Firefox 1.5 поддерживает CUR и SVG cursor-ы, при этом он не поддерживает формат ANI. IE поддерживает форматы CUR и ANI, но не понимает SVG cursor-ов.

Свойство cursor является наследуемым.
Также существует еще одно значение - inherit. Это значение говорит о том, что свойство наследуется от элемента-родителя.
Значение свойства cursor по умолчанию: auto

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

Styler
Сообщений: 436
Сообщение # 2 | 17:01:38
Вид курсора определяется с помощью CSS свойства cursor.

CSS-свойство cursor позволяет нам устанавливать собственный вид курсора элементам страницы, причем, можно использовать как стандартные виды курсоров, так и курсоры, определенные пользователем (файлы CUR или SVG курсоры).

CSS-свойство cursor - свойство для изменения внешнего вида курсора

Для простоты разделим курсоры на группы...

Стандартные курсоры
auto - курсор по умолчанию для текущего элемента.
crosshair - простое перекрестие (напоминающее символ "+").
default - курсор, используемый по умолчанию на данной платформе. Зачастую представляется в виде стрелки.
pointer - курсор представляется указателем, обозначающим ссылку.
move - курсор, определяющий объект, который можно переместить.
e-resize, ne-resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize - курсоры, обозначающие возможность перемещения некоторого края объекта.
text - курсор, обозначающий текст, который может быть выделен. Зачастую представляется в виде вертикальной линии "|".
wait - курсор, обозначающий занятость программы, и говорящий пользователю, что следует подождать. Зачастую представляется в виде циферблата или песочных часов.
help - курсор, означающий, что для объекта, на который он указывает, имеется справочная информация. Зачастую представляется в виде вопросительного знака или воздушного шара.

Пример использования:

Code
SPAN.help { cursor : help; }

Курсор определенный пользователем:
Может возникнуть ситуация, когда появится необходисомть в курсоре необычного вида. Тогда следует в качестве значения свойства cursor указать:

url('путь к курсору'), стандартный курсор
Для наглядности приведу примеры:

Code

P { cursor : url("my.cur"), text; }  
P { cursor : url("my.svg"), url("my.cur"), auto; }

Когда браузер встречает определение пользовательского курсора, он пытается отобразить первый курсор из списка. Если первый курсор не может быть отображен, то браузер пытается задействовать следующий по списку курсор. Обратите внимание, что всегда в конце списка пользовательских курсоров указывается какой-то стандартный курсор, на тот случай, если ни один из пользовательских курсоров не сможет быть отображен.

В качестве пользовательского курсора можно использовать файлы в формате CUR, ANI или SVG курсоры. SVG cursor - это платформо-независимый пользовательский курсор, где сам курсор является файлом изображения. Рекомендуется использовать PNG формат, так он поддерживает маску прозрачности через альфа-канал, но можно использовать и GIF, ибо он поддерживает 2-битную прозрачность. Если же используется другой формат изображения, который не поддерживает прозрачность ни через альфа-канал, ни через назначение отдельного цвета в качестве прозрачного, то курсор будет представлен в виде непрозрачной прямоугольной области. Следует также напомнить, что следует использовать в курсоре по меньшей мере два цвета, чтобы он был различим на различном фоне.

Пользовательские курсоры поддерживаются начиная с IE6, Firefox 1.5. Firefox 1.5 поддерживает CUR и SVG cursor-ы, при этом он не поддерживает формат ANI. IE поддерживает форматы CUR и ANI, но не понимает SVG cursor-ов.

Свойство cursor является наследуемым.
Также существует еще одно значение - inherit. Это значение говорит о том, что свойство наследуется от элемента-родителя.
Значение свойства cursor по умолчанию: auto

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

football-sport
Репутация: 11
Уровень замечаний:

Сообщение # 3 | 20:52:27
Где можно скачать стильные курсоры? Гугл не находит нормальногО!

Styler
Разработчик
Сообщений: 436
Репутация: 144

Сообщение # 4 | 13:38:16
Есть хорошая программа - CursorXP
В ней уже есть готовые курсоры и можно делать свои!


Не оказываю техническую поддержку через систему личных сообщений!
gta-s
Сообщений: 1
Репутация: 4
Уровень замечаний:

Сообщение # 5 | 12:05:20
http://www.bum-files.com/ там есть и курсоры и все
Styler
Разработчик
Сообщений: 436
Репутация: 144

Сообщение # 6 | 12:43:59
Code

label { cursor: url("/icons/menel1.cur"), pointer; }

Вы читали то что выше написано? Курсоры перечисляются через запятую - в случае если не найден первый - берется следующий.



Не оказываю техническую поддержку через систему личных сообщений!
football-sport
Репутация: 11
Уровень замечаний:

Сообщение # 7 | 14:23:02
Вот собрал отличный пак курсоров для сайта и для Windows
Pack Часть 1
Часть 2
Не забываем о репутации^^

klubnika5559
Сообщений: 1
Репутация: 6

Сообщение # 8 | 11:45:35
Специально для ленивых! Знаю пару девчачьих сайтов, где есть подробные инструкции для тупых (сама часто пользуюсь! biggrin )
1. http://www.diano4ka.ru/ama.php - там почитайте)
2. http://fantasyflash.ru/index.php?&kontent=cursors - тоже есть

P.S. радостная новость для ленивых мальчиков - на втором сайте есть инструкция для создания и вставки своих курсоров.
P.P.S. На каком то из этих сайтов видела ссылку на другой сайти, где много других "обоеполых" курсоров. (сама чё то не могу найти... вчера видела tongue )

Добавлено (18-Фев-2009, 11:45:35)
---------------------------------------------
А и ещё тут есть эффектики >>> http://fantasyflash.ru/index.php?&kontent=script


Я вообще не продвинутая в компах и сайтах... Если я чё то спрошу, по возможности отвечайте детскими словами, иначе до меня не дойдёт!..
o_Lisovenko
uProduct
Сообщений: 4368

Сообщение # 9 | 07:52:32
Тема перемещена в МАНУАЛ.

Сообщество uCoz » Архивариус » Архив » Курсоры (Как изменить или поставить собственный курсор на сайте)
Страница 1 из 11
Поиск: