在AgendaWeek视图和AgendaDay视图中今天行的FullCalendar背景颜色

时间:2017-08-07 11:05:53

标签: javascript fullcalendar

在Fullcalendar的agendaWeek视图和agendaDay视图中,有人可以帮我修改今天行的背景颜色吗?这是我日历的代码:

<style>
        body {
            padding-top: 70px;
            /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
        }
        #calendar {
            max-width: 100%;
        }
        #calendar.agenda-week{
          background-color: #FF9900;
        }
</style>
//...
$('#calendar').fullCalendar({
            locale: "es",
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            views: {
                week: {
                columnFormat:'ddd D',
                },
            },
            defaultView: 'agendaWeek',
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            selectable: true,
            selectHelper: true,
            minTime: "09:30:00",
            maxTime: "19:30:00",
            slotLabelFormat: "h(:mm)a",
            slotDuration: "00:30:00",
            slotLabelInterval: "00:30:00",
            businessHours:
            {
              start: '13:30',
              end:   '17:00',
              dow:  [1,2,3,4,5,6,0]
            },
            dayRender: function (date, cell) {

                var today = new Date();

                if (date.date() === today.getDate() && date.month() === today.getMonth()) 
                {
                   cell.css("background-color", "#C0C0C0");//gray for today in month view
                }                    

            },
            viewRender: function(view,element){
                $("#calendar").addClass('agenda');//this change background color to orange for all views
            },
            //...
        });

这是现在的日历

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:3)

我希望我能正确理解你。

使用CSS,您可以执行以下操作:

#calendar .fc-agendaWeek-view .fc-today,  #calendar .fc-agendaDay-view .fc-today {
  background: red !important;
}