JS Fullcalendar背景颜色未设置

时间:2014-08-07 05:21:21

标签: javascript jquery fullcalendar

我正在尝试使用FullCalendar JS http://arshaw.com/fullcalendar/

设置事件的背景颜色

这是我的JS:

<script>
$('#calendar').fullCalendar({
    events: [
        {
            title: 'Test',
            start: '2014-08-07',
            url: '#',
            backgroundColor: '#FF0000',
            editable: true
        },
    ]
});
</script>

这就是产生的东西

enter image description here

为什么它没有产生我想要的结果,事件背景颜色为红色。

1 个答案:

答案 0 :(得分:2)

您可以更改事件的backgroundColor属性,例如:

$('#calendar').fullCalendar({
    {
      title: '1',
      start: new Date(2014, 02, 25, 10, 30),
      allDay: false,
      editable: false,
      backgroundColor: '#ED1317'
    },
    {
      title: '2',
      start: new Date(2014, 02, 26, 10, 30),
      allDay: false,
      editable: false,
      backgroundColor: '#ED1317'
    },
    ...
});

对于其他日期,只需使用.fc-future和.fc-today CSS属性:

.fc-future,
.fc-today {
    background-color: #10CC55;
}

已更新:

$('#calendar').fullCalendar({
eventSources: [        
    {
        events: [ 
            {
                title  : 'event1',
                start  : '2010-01-01'
            },
            {
                title  : 'event2',
                start  : '2010-01-05',
                end    : '2010-01-07'
            },
            {
                title  : 'event3',
                start  : '2010-01-09 12:30:00',
            }
        ],
        backgroundColor: '#ED1317'
    }  
]