我正在使用
jQuery fullcalendar(版本2.7.1).
这就是我想要做的：
现在我可以将背景设置为红色,但文本不会出现.这就是我正在做的事情：
var m = moment('2016-09-19');
$('#calendar').fullCalendar({
// put your options and callbacks here
left: 'title',center: '',right: 'prev,next',weekends: false,weekNumbers: true,defaultView: 'month',defaultDate: m,events: [
{
start: '2016-09-19',allDay : true,rendering: 'background',backgroundColor: '#F00',title: 'full',textColor: '#000'
},{
start: '2016-09-20',textColor: '#000'
}
]
});
这是它的样子：
正如你所看到的,我也没有在我的右侧导航中添加“今天”,但无论如何都添加了….
我也想知道如何限制几个月的导航.例如,他们只能在2016年10月,10月,11月选择月份.
任何人都可以帮我解决这个问题吗？
解决方法
您可以使用
eventAfterRender回调.在此回调中,将字符串FULL附加到元素参数.您可以使用event-full类将CSS样式应用于此.
背景颜色较浅,因为不透明度为0.3;使用event-full类将其更改为1.
要隐藏今天按钮,您必须在header对象中设置左,中,右属性.
要限制月份导航,可以使用viewRender回调.
JS
var m = moment('2016-09-19');
$('#calendar').fullCalendar({
// put your options and callbacks here
header: {
left: 'title',right: 'prev,next'
},events: [{
start: '2016-09-19',allDay: true,textColor: '#000',className: 'event-full'
},{
start: '2016-09-20',className: 'event-full'
}],eventAfterRender: function (event,element,view) {
element.append('FULL');
},viewRender: function (view,element) {
var start = new Date("2016-09-01");
var end = new Date("2016-11-30");
if (end < view.end) {
$("#calendar .fc-next-button").hide();
return false;
} else {
$("#calendar .fc-next-button").show();
}
if (view.start < start) {
$("#calendar .fc-prev-button").hide();
return false;
} else {
$("#calendar .fc-prev-button").show();
}
}
});
CSS
.event-full {
color: #fff;
vertical-align: middle !important;
text-align: center;
opacity: 1;
}
