Fullcalendar - display a half-day event in a month view

Question

How do you show a half day event in a month view? For example, I have an event lasting 12 hours. I would like the date cell for this event to display only half the bar. Is it possible? If so, how to implement it?

Answer 1

So, events are positioned as “absolute”, it’s difficult ...

Using the eventAfterRender callback as follows:

, eventAfterRender: function(event, element, view) { /** * get the width of first day slot in calendar table * next to event container div */ var containerWidth = jQuery(element).offsetParent() .siblings("table").find(".fc-day-content").width(); // half a day var elementWidth = parseInt(containerWidth / 2); // set width of element jQuery(element).css('width', elementWidth + "px"); } 

Of course, you can improve :-)