Как динамически менять цвет в зависимости от фона?

  • Автор темы GSM-info
  • Обновлено
  • 16, May 2024
  • #1
Привет, ребята, я считаю, что название уже многое говорит о моем вопросе.

У меня возникла проблема с этой проблемой, и я не знаю, как ее решить.

По сути, у меня есть синий круг размером 300x300 пикселей, который следует за курсором, куда бы он ни пошел.

Теперь цвета не являются проблемой, если круг включен, скажем, на белом фоне, но когда я перемещаю курсор на фон того же цвета, что и круг, круг явно сливается с ним.

Есть ли способ изменить цвет круга, когда он находится на фоне определенного цвета? Вот моя ручка: http://codepen.io/bayron2304/pen/VKvOoZ

Спасибо за любую помощь!

GSM-info


Рег
20 Nov, 2013

Тем
64

Постов
198

Баллов
548
  • 21, May 2024
  • #2
Самым простым решением было бы добавить белую рамку вокруг синего круга и сделать так, чтобы она пересекала синий фон с помощью z-index:
https://jsfiddle.net/gcpq7x2w/1/
 

GetActiva


Рег
14 Jan, 2014

Тем
68

Постов
164

Баллов
544
  • 06, Jun 2024
  • #3
Вообще говоря, нет.

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

Взять обычные указатели Windows? Они сплошные белые? Они сплошные черные? Нет, это черный контур вокруг белого, к которому вы можете добавить дополнительную тень. Тогда решение? не используйте одноцветный курсор.

Придайте ему границу или тень, которая будет противоположной его яркости.
 

Romajke


Рег
17 Mar, 2014

Тем
73

Постов
211

Баллов
586
Тем
403,760
Комментарии
400,028
Опыт
2,418,908

Интересно