Полный календарь меняет цвет фона только на рабочие часы - PullRequest
Новая
       19

Полный календарь меняет цвет фона только на рабочие часы

1 голос
/ 08 апреля 2020

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

enter image description here

1 Ответ

0 голосов
/ 08 апреля 2020

Заметили ли вы, что когда вы устанавливаете рабочее время, только части, которые являются , а не частью рабочего времени, изменили свой цвет? Поэтому сами рабочие часы оставались с цветом по умолчанию.

Кроме того, времена, которые попадают в рабочие часы, просто оставляются пустыми - невозможно выделить эти области конкретно в HTML. Принимая во внимание, что нерабочие часы реализуются с использованием фоновых событий с заданным набором цветов c.

Однако эти события частично прозрачны, поэтому, если вы измените цвет фона по умолчанию для всего календаря, он также изменит основной цвет фоновых событий. Это затрудняет изменение цвета зоны рабочего времени.

Самое близкое решение, которое я мог бы получить к тому, о чем вы просили, это изменить цвет всего календаря, но затем сделать так, чтобы нерабочие часы не имели прозрачности, поэтому вы не можете видеть измененный цвет под ними. , Это делается так, используя пару простых CSS правил: 

.fc-body
{
  background-color: #ECE4C6
}

.fc-nonbusiness
{
  opacity:1;
}

Демонстрация: https://codepen.io/ADyson82/pen/NWGKaOB

(Если вы не понимаете, я обнаружил классы для использования, проверив HTML, сгенерированный fullCalendar, используя Инструменты разработчика моего браузера.)

...