В html как сделать мигающий курсор

Как изменить курсор для DIV?

С помощью css изменил курсор на сайте на картинку! Прописал курсор для всех возможных используемых тегов! Все работает, но только для тега div курсор никак не меняется! Меняется только в том случае если для div применить id. Но проблема в том что многие div уже имеют свои id, class, и даже значения cursor! Как можно сделать что бы изменить курсор всем div независимо от их параметров, и изменить ли его в обще?! Кто знаем помогите, некрасиво смотрится когда курсор мигает на сайте при перемещении.

Лучшие ответы ( 1 )
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:

Как изменить значения div в css, чтобы расстояния между блоками div не было?
Приветствую! Не могу решить такую задачу. Имеется общая обертка div (wrap). Внутри div-wrap.

Как изменить курсор
Нужно сделать так, чтобы в каждом фрейме был разный курсор.

Contenteditable div, как менять тип элемента на котором находится курсор
Здравствуйте, я сейчас делаю свой текстовой редактор или WYSIWYG, сделал кнопку которая добавляет.

Как изменить курсор?
Когда я навожу курсор на Edit или Memo или RichEdit или . то курсор меняется со стрелочки в | (не.

956 / 518 / 244
Регистрация: 20.05.2015
Сообщений: 774

Лучший ответ

Сообщение было отмечено JackieRyan как решение

Решение

JackieRyan, можно для всей страницы заменить или для определенного класса/идентификатора.

1 2 3 4 5

div>/div> div>/div> div>/div> p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Corrupti quidem qui rerum harum ullam ipsa odit. Libero reprehenderit nihil eum optio similique tempore, totam illum ab eaque rem? Soluta, voluptas?/p> div class="text">/div>

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

/* изменяем курсор для абсолютно ВСЕХ элеменотов страницы */ * { cursor: not-allowed; } /* изменяем курсор для всеx элементов, находящихся в html -> body страницы */ html, body { cursor: not-allowed; } /* изменяем курсор при наведении на блок div */ div:hover { cursor: cell; } /* изменяем курсор при наведении на класс .text */ .text:hover { cursor: pointer; } div { width: 60px; height: 60px; margin: 0.5em 0; background-color: #eeeeee; } .text { background-color: #87d37c; }

верстка, позиционирование курсора в input text

при верстке — задал фон(картинку) для элемента «input type=text», изменил высоту элемента. проблема — мигающий курсор для ввода текста в опере отображается не в позиции x-0, y-0, а по средней линии (см. рисунок). все бордеры и марджины и паддинги равны нулю, также пробовал vertical-align менять — не помогает. Opera — 9.64 Firefox — 3.5.3 html-код:

.hsearch <
margin: 0 0 0 0;
padding: 0 0 0 0;
width: 350px;
height: 40px;
float: left;
>

.hsearch input[type=»text»] <
background: top left url(img/hsearch.png) no-repeat;
margin: 0 0 0 0;
padding: 0 0 0 0;
border: none;
height: 30px;
width: 208px;
line-height: 16px;
>

вопрос: Как позицианировать этот курсор в верхнюю левую точку в Опере?

jpg 45676.jpg

На сайте с 04.02.2008

21 октября 2009, 22:18

Проще фоновый рисунок делать для внешнего блока, а уже внутри этого блока позиционировать input с точностью до пикселя.

cursor

Устанавливает форму курсора, когда он находится в пределах элемента. Вид курсора зависит от операционной системы и установленных параметров.

Прежде чем воспользоваться возможностью переделать вид курсора, решите, а будет ли он использоваться к месту. Многих пользователей подобные изменения могут ввести в заблуждение, когда, например, вместо традиционной руки, появляющейся при наведении на ссылку, возникает нечто другое. В большинстве случаев, лучше оставить все как есть.

Синтаксис

Значения

url Позволяет установить свой собственный курсор, для этого нужно указать путь к файлу с курсором. auto Вид курсора по умолчанию для текущего элемента. inherit Наследует значение родителя.

Остальные допустимые значения приведены в табл. 1.

Табл. 1. Вид курсора

Вид	Значение	Тест	Пример
	default	P
	crosshair	P
	help	P
	move	P
	pointer	P
	progress	P
	text	P
	wait	P
	n-resize	P
	ne-resize	P
	e-resize	P
	se-resize	P
	s-resize	P
	sw-resize	P
	w-resize	P
	nw-resize	P

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

При добавлении курсора из файла синтаксис несколько видоизменится.

cursor: url(‘путь к курсору1’), url(‘путь к курсору2’), .

Через запятую допускается указывать несколько значений url , в этом случае браузер попытается открыть первый файл с курсором и если это по каким-либо причинам не получится, перейдет к следующему файлу. Список обязательно заканчивается ключевым словом, например, auto или pointer , допустимые значения перечислены выше.

HTML5 CSS2.1 IE Cr Op Sa Fx

    cursor .cross < cursor: crosshair; >.help

Результат данного примера показан на рис. 1.

Применение свойства cursor

Рис. 1. Применение свойства cursor

HTML5 CSS2.1 IE Cr Op Sa Fx

    cursor   Обычный текст





 Ссылка 1 Ссылка 2 Ссылка 3

Объектная модель

[window.]document.getElementById(» elementID «).style.cursor

Браузеры

Некоторые браузеры поддерживают дополнительные формы курсоров. Например, Internet Explorer и Opera работает со значением hand , которое является аналогом значения pointer . Кроме того, в браузерах Safari, Chrome и Firefox будут действовать следующие значения: all-scroll , col-resize , no-drop , not-allowed , row-resize , vertical-text . Учтите, что указанные значения не входят в спецификацию CSS 2.1, но соответствуют спецификации CSS3 (кроме hand ).

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

Opera не работает с файлами курсора.

Мигающий курсор на всех текстовых элементах html в хроме?

Судя по всему после последнего обновления это добавили, можно ли это как то убрать?
Например эти полоски меню сделаны у меня 3 спанами

Вопрос задан более года назад
60 просмотров

7 комментариев

Простой 7 комментариев