Пользовательское изображение курсора не работает во всех IE?

Question

Я думаю, что пробовал разные методы, предложенные по всему интернету, но ничего не получалось.Это мой текущий код CSS:

div {
   cursor: url(images/zoomin.cur), auto;
}

Работает нормально, кроме как в IE ...

Answer 1

К сожалению, cursor является простой ошибкой в ​​IE, по крайней мере до и включительно 8

В Internet Explorer для Windows вплоть до версии 8 включительно, если в URI указано относительное значение URIфайл внешней таблицы стилей, базовый URI считается URI документа, содержащего элемент, а не URI таблицы стилей, в которой появляется объявление.

http://reference.sitepoint.com/css/cursor

Вы можете захотеть использовать conditional comment для таргетинга IE, а затем передать ему измененное правило стиля с другим url.

Answer 2

Я решил таким образом для захватить курсор в Internet Explorer, цитируя ответ @ JasonGennaro :

В Internet Explorer для Windowsдо версии 8 включительно, если во внешнем файле таблицы стилей указано относительное значение URI, базовый URI считается URI документа, содержащего элемент, а не URI таблицы стилей, в которой появляется объявление.

.grab_cursor {
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    cursor: url('../img/cursors/openhand.cur'), url('img/cursors/openhand.cur'), n-resize; /* standard: note the different path for the .cur file */
    cursor: url('img/cursors/openhand.cur'), n-resize\9; /* IE 8 and below */
    *cursor: url('img/cursors/openhand.cur'), n-resize; /* IE 7 and below */
    _cursor: url('img/cursors/openhand.cur'), n-resize; /* IE 6 */
}

Дерево файлов :

index.html
css/style.css -> here the posted code
img/cursors/openhand.cur

Хорошие ссылки :

• Один
• Два
• Три

Рабочая демонстрация :

• Демо

Answer 3

Поскольку разные браузеры по-разному обрабатывают относительные URI, стиль курсора допускает список URL-адресов. У вас может быть один путь, который работает для IE, и один, который работает для других браузеров:

div {
   cursor: url('app/images/zoomin.cur'), url('zoomin.cur'), auto;
}

В моей настройке первый URL работает для IE11 (и более ранних версий), поскольку скрипт, использующий курсор, находится в 'cgi-bin / app', а файлы .cur и .css находятся в 'app / images'. IE использует местоположение документа в качестве основы, поэтому мне нужно добавить дополнительную информацию о пути, чтобы найти файл курсора. Второй URL работает в Firefox, потому что .cur и .css находятся в одном месте, а Firefox использует местоположение .css в качестве базы, поэтому дополнительная информация о пути не требуется.

Answer 4

Из документации MSDN: URL (URI) Internet Explorer 6 и более поздних версий.Курсор определяется автором с использованием пользовательского URI, такого как url ​​('mycursor.cur'). Курсоры типа .CUR и .ANI являются единственными поддерживаемыми типами курсоров .

Answer 5

эта работа для меня доказана в IE10, INDEXED в файле index.html (необходимо использовать абсолютные маршруты)

<style type="text/css">
    .container{
    cursor: url(http://path/of/folder/image.cur), default !important;
        }
</style>

Answer 6

Для работы в IE необходимо указать полный путь к файлу CUR.Например:

html {
    cursor: url("../img/cursor.png"), url("http://www.example.com/dist/assets/img/cursor.cur"), default;
}

Answer 7

Я пытался использовать .ani и .gif, и это работает. Это должно идти так:

body {
cursor: url(images/dog.ani), url(images/dog.gif), progress !important;
}

Этот CSS работает для моего сайта в Chrome, Firefox и IE.

Answer 8

от: http://www.w3schools.com/cssref/pr_class_cursor.asp

Свойство курсора поддерживается во всех основных браузерах.

Примечание. Opera 9.3 и Safari 3 не поддерживают значения URL.

Примечание. Значение «наследовать» не поддерживается в IE7 и более ранних версиях. IE8 требует! DOCTYPE. IE9 поддерживает «наследовать».