Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.
Нажимай и поддержи.

Пн Вт Ср Чт Пт Сб Вс
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30


Чувашия-это моя Россия

Ссылки на каскадные стили CSS - cursor.

Поддержка Браузеров

Internet Explorer Интернет эксплорер Google Chrome Google Chrome Opera Опера Firefox Firefox Safari Сафари, то есть поддерживается во всех основных браузерах.

Определение и использование. Свойство cursor курсор указывает тип курсора, который будет отображаться при наведении на элемент. Auto - вид курсора зависит от типа браузера на страницах сайта. Url - возможность задания своего курсора. Указывается путь к файлу( в формате cur или ani) с курсором. Через запятую необходимо указать несколько url файлов с нестандартными курсорами, потом прописать( добавить) одно из значений, приведенных чуть ниже в таблице. Когда у браузера не получиться отобразить ни один из этих уникальных курсоров, тогда будет установлен указанный Вами стандартный курсор.

Самое мощное и интересное здесь не в том, что производится какое-то изменение какого-то участка( элемента) страницы сайта. Вся интересная и необходимая информация в том, что свойство cursor, которое действует через стили CSS3 автономно работает даже при отключения JavaScripta в браузере Вашего компьютера. Всегда и при любых обстоятельствах.


Синтаксис:

              cursor: value;

Описание и Использование

Значение по умолчанию: auto
наследует: да
анимируемых: нет
Версия: CSS2
JavaScript синтаксис: object.style.cursor="crosshair"


Свойства Значения

Значение Описание
alias Курсор указывает псевдоним, то должен быть создан
all-scroll Курсор указывает на то, что что-то можно прокручивать в любом направлении
auto По умолчанию. Браузер устанавливает курсор
cell Курсор указывает на то, что ячейку (или несколько ячеек) могут быть выбраны
context-menu Курсор указывает, что контекст-меню доступно
col-resize Курсор указывает на то, что столбец может быть изменен по горизонтали
copy Курсор указывает на что-то копируется
crosshair Курсор отображаться в виде перекрестия
default По умолчанию курсор
e-resize Курсор указывает на то, что края блока необходимо переместить вправо( восточный)
ew-resize Указывает, двунаправленный курсор изменения размера
help Курсор указывает на то, что помощь доступна
move Курсор указывает на то, будет перемещен
n-resize Курсор указывает на то, что край ящика должен быть перемещен вверх( на север)
ne-resize Курсор указывает на то, что край ящика должен быть перемещен вверх и вправо(север/восток)
nesw-resize Указывает, двунаправленный курсор изменения размера
ns-resize Указывает, двунаправленный курсор изменения размера
nw-resize Курсор указывает на то, что край ящика будет перемещен вверх и влево( север/запад)
nwse-resize Указывает, двунаправленный курсор изменения размера
no-drop Курсор указывает на то, что перетаскиваемый объект не может быть удален здесь
none Нет курсора отображается на элемент
not-allowed Курсор указывает на то, что запрошенное действие не будет выполняться
pointer Курсор-это указатель и указывает на ссылку
progress Курсор указывает на то, что программа занята (в разработке)
row-resize Курсор указывает на то, что строка может быть изменена по вертикали
s-resize Курсор указывает на то, что края блока будет перемещены вниз( на юг)
se-resize Курсор указывает на то, что края блока будут перемещены вниз и направо(на юг/восток)
sw-resize Курсор указывает на то, что края блока будут перемещены вниз и влево (юго-запад)
text Курсор указывает текст, который может быть выбран :
URL Разделенный запятой список адресов Url. Внимание!!! Всегда задавайте универсальный курсор в конец списка.
vertical-text Курсор указывает на то, что текст, который может быть выбран.
w-resize Курсор указывает на то, что края блока будут перемещены влево(на запад)
wait Курсор указывает на то, что программа занята
zoom-in Курсор указывает на то, что что-то может быть увеличено
zoom-out Курсор указывает на то, что что-то может быть уменьшено,
initial Это свойство задает значение по умолчанию.
inherit Наследует это свойство от своего родительского элемента.


Пишем программу:

< !DOCTYPE>
< html>
< body>
< p>Мыши над словами, для изменения курсора.< /p>
< span style="cursor:auto">auto< /span>< br>
< span style="cursor:crosshair">crosshair< /span>< br>
< span style="cursor:default">default< /span>< br>
< span style="cursor:e-resize">e-resize< /span>< br>
< span style="cursor:help">help< /span>< br>
< span style="cursor:move">move< /span>< br>
< span style="cursor:n-resize">n-resize< /span>< br>
< span style="cursor:ne-resize">ne-resize< /span>< br>
< span style="cursor:nw-resize">nw-resize< /span>< br>
< span style="cursor:pointer">pointer< /span>< br>
< span style="cursor:progress">progress< /span>< br>
< span style="cursor:s-resize">s-resize< /span>< br>
< span style="cursor:se-resize">se-resize< /span>< br>
< span style="cursor:sw-resize">sw-resize< /span>< br>
< span style="cursor:text">text< /span>< br>
< span style="cursor:w-resize">w-resize< /span>< br>
< span style="cursor:wait">wait< /span>< br>
< span style="cursor:not-allowed">not-allowed< /span>< br>
< span style="cursor:no-drop">no-drop< /span>< br>
< /body>
< /html                      

Результат программы:

Мыши над словами, для изменения курсора. Подводите курсор к значениям слов и увидите как курсор преобразуется.

auto
crosshair
default
e-resize
help
move
n-resize
ne-resize
nw-resize
pointer
progress
s-resize
se-resize
sw-resize
text
w-resize
wait
not-allowed
no-drop



seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: