FullCalendar：自定义日历

我需要帮助定制全日历显示。像改变边框颜色，日历背景，添加删除月/日/周视图或按钮？

这是我要显示日历：

//$('#calendar').fullCalendar() 

var myCalendar = $('#calendar'); 
myCalendar.fullCalendar(); 

// Adding a Simple event 
var myEvent = { 
    title: "New Event Added", 
    allDay: true, 
    start: new Date(), 
    end: new Date() 
};   

myCalendar.fullCalendar('renderEvent', myEvent);

来源

2013-10-01 fireholster

你有fullcalendar.css编辑有.fc-header类，你可以编辑你的要求。

来源

2013-10-02 06:14:54 Sharvari

您应该避免直接编辑0，以便在下一个版本发布时更新CSS。

要定制FullCalendar的外观，请创建一个fullcalendar-custom.css文件，您可以使用该文件覆盖特定的样式。只是包括fullcalendar.css后这个地方自定义文件，即：

<link href="../fullcalendar/fullcalendar.css" rel="stylesheet"> 
<link href="../fullcalendar/fullcalendar-custom.css" rel="stylesheet">

找出你需要重写什么风格，你应该使用检查元素在浏览器中找出哪些类需要进行修改。

初始化FullCalendar时，您可以删除/修改“月/日/周”视图按钮。

例如，你可以这样做：

myCalendar.fullCalendar({ 
    header: { 
     left: 'prev,next today title', 
     right: 'month,agendaDay' 
    } 
});

欲了解更多信息，请参阅header和available views的文档。

来源

2013-10-02 19:53:46 nomatteus

你可以在JS这些线路

e.color = event.color; 
e.backgroudColor = event.backgroudColor; 
e.borderColor = event.borderColor; 
e.textColor = event.textColor;

所以，如果你想通过颜色代码分开，你可以使用这个

start: new Date(y, m, d+1, 15, 0), 
end: new Date(y, m, d+1, 16, 45),                      
title: 'On vacations', 
color: '#777777', 
backgroundColor: '#eeeef0'

来源

2013-10-03 09:55:44 Sharvari

FullCalendar：自定义日历

回答

相关问题