Почему не работает url() у cursor?
В папке static лежит файл style.css, index.html и сама картинка(исключая несколько файлов js, они тут роли не играют). В css файле пишу:
#canvas { cursor: url('hand.png'), pointer; } |
#canvas { cursor: url('hand.png'), pointer; }
и отображается именно pointer. Пробовал писать со static, пробовал без кавычек (в VScode тогда файл отображался как ссылка и я мог перейти по ней увидев саму картинку), но ничего из этого не помогло, иногда даже выходила ошибка, говорящая что не может hand.png найти. При том коде, что я выложил, такой ошибки нет, но отображается именно pointer
CSS подключен к html нормально, без бед
Дополнительно:
А укажи путь через ./
#canvas { cursor: url('hand.png') 0 0, pointer; } |
#canvas { cursor: url('hand.png') 0 0, pointer; }
если ее уменьшить до 10*10 (или 20*20), то будет работать?
Вот на хабре дернул иконку, вставил как курсор - работает
Тест - для любого элемента в консоли задать
cursor: url(https://assets.habr.com/qna/6516ca7e/images/search-filters-arrow.svg) 0 0, not-allowed; |
cursor: url(https://assets.habr.com/qna/6516ca7e/images/search-filters-arrow.svg) 0 0, not-allowed;
https://developer.mozilla.org/en-US/docs/Web/CSS/c...
о, эта сработала, значит явно что-то с размерами
ну тогда и картинку hand.png к вопросу прикрепили бы
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Чтобы понять, почему не работает url() у cursor, следует учитывать несколько возможных причин.
1. Проверьте, что вы правильно используете функцию url() в CSS. Функция url() предназначена для указания пути к файлу, который будет использоваться в качестве значения свойства cursor. Например:
cursor: url('path/to/cursor.png'), auto;
2. Убедитесь, что путь к файлу указан правильно. Проверьте, что путь начинается с правильного корневого каталога и что все символы в пути к файлу написаны верно.
3. Проверьте, что файл с указанным именем и расширением действительно существует в указанном месте. Проверьте права доступа к файлу и убедитесь, что он доступен для чтения.
4. Убедитесь, что указанный файл является файлом изображения, который поддерживается для использования в качестве курсора. Обычно поддерживаются форматы PNG, GIF и CUR.
5. Проверьте поддержку браузером указанного типа курсора. Некоторые браузеры могут не поддерживать определенные типы курсоров или специфические форматы файлов.
Если после выполнения всех этих шагов проблема не решена, попробуйте проверить ваш код на наличие других ошибок или конфликтов, которые могут повлиять на отображение курсора. Если проблема сохраняется, уточните вопрос, предоставив больше информации о своем коде и окружении, чтобы получить более точный ответ.