Full Calenday cell background color

佐手、 提交于 2019-12-12 03:34:35

问题


I need to change the background color of dates in fullcalendar. My case is similar to this question: change background color of a range of dates in fullcalendar but the solution there is changing the EVENT background color. What I want is to change the cell background color of dates recieved from the controller like ["2013-02-22", "2013-2-20"]

I tried parsing this dates then change its background color using jquery css function but it didn't work.


回答1:


In month view, you can set the background color of individual days like this (using jQuery):

$(".fc-day4").addClass("myBackgroundClass");

In your CSS file, you will have something like this:

.myBackgroundClass {
    background-color: grey;
}

This will give the fourth day of the view (not necessarily the fourth day of the month, since the first day in month view is often actually from the previous month) a grey background.

In agendaWeek view it works differently:

$(".fc-col0").addClass("myBackgroundClass");

This will give the left-most day of the week view a grey background (use fc-col1 .. fc-col6 for the other six days of the week). In agendaDay view, simply use fc-col0.

The hard part is calculating which date corresponds to which column (and, in case of month view, row) in the calendar. You can do these calculations in the viewDisplay callback, which, according to the docs, is triggered "when the calendar loads and every time a different date-range is displayed."

When you start your calculations, you will want to remove your custom background from all columns and rows, which you can do like this:

$(".myBackgroundClass").removeClass("myBackgroundClass");


来源:https://stackoverflow.com/questions/15048658/full-calenday-cell-background-color

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!