2010-07-31

Изменение вида курсора в HTML

   Продолжая тему оформления ссылок, нельзя не уделить внимание возможности изменения курсора. Для этого в код ссылки вида <a href="URL СТРАНИЦЫ" style="cursor: help;"> ВАШ ТЕКСТ</a> вставляем код желаемого курсора, которые вы видите ниже в таблице:
 style="cursor: crosshair;"
 style="cursor: pointer;"
 style="cursor: move;"
 style="cursor: e-resize;"
 style="cursor: ne-resize;"
 style="cursor: nw-resize;"
 style="cursor: n-resize;"
 style="cursor: sw-resize;"
 style="cursor: se-resize;"
 style="cursor: s-resize;"
 style="cursor: w-resize;"
 style="cursor: text;"
 style="cursor: wait;"
 style="cursor: help;"
 style="cursor: auto;"
 Курсор крестиком
 Курсор на свободном пространстве
 Курсор перемещения объекта
 Курсор - стрелка вправо
 Курсор - стрелка вверх и вправо
 Курсор - стрелка вверх и влево
 Курсор - стрелка вверх
 Курсор - стрелка вниз и влево
 Курсор - стрелка вниз и вправо
 Курсор - стрелка вниз
 Курсор - стрелка влево
 Курсор на тексте
 Курсор - песочные чaсы
 Курсор вопросом
 Курсор подбирается автоматически
Таким образом получаем ссылку вида: Помощь

.. Как вариант вы можете изменить вид курсора в вашем блоге на blogspot и выбрать в качестве курсора любое изображение.
Например, вы можете выбрать такой курсор:
 или такой , можете найти или нарисовать сами курсор на свой вкус.


Небольшая деталь - курсор не работает в Опере и IE, зато в Google Chrome проблем не обнаружено.
Как изменить курсор в blogger?

  1. Найдите в шаблоне блога код ]]>
  2. Добавьте перед ним код 
body, a, a:hover {cursor: url(ссылка на изображение курсора), progress;}
В моем примере  я вставила код:
body, a, a:hover {cursor: url(http://cursors3.totallyfreecursors.com/thumbnails/apple-tmani.gif), progress;}

1 комментарий :

чел челкоФ комментирует...

arrow забыл!

Отправить комментарий

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