00:00 附近的事件被切断(可见)

Event getting cut ( visible ) near 00:00

我正在使用 FullCalendar v.3.4.0,没有 CSS 更改。

我只有基本 css 和声明的打印版本。

正如您在图片上看到的那样,在接近午夜时分开始的最后一个活动在视觉上被剪掉了。

在 Fullcalendar 的 Github 中,有一个关于 Chrome 对 table 的渲染的棘手问题,但我不确定问题是否出在那里。

我还没有尝试过 Firefox,但我 运行 在 Android 上的 Cordova 应用程序的 Web 视图中,所以我必须 Chrome。

example of the issue

初始化代码

    $('#events').fullCalendar({
        defaultView: 'agendaDay',
        allDaySlot: false,
        editable: false,
        eventLimit: true,      
        displayEventTime: true,
        header: {
           left: 'prev,next today',
           center: 'title',
           right: 'month,agendaWeek,agendaDay,listMonth'
        },
        events: "remote.php"
   }

我可以添加一个“幽灵”事件,以便它推送溢出的视图以查看该事件吗?我想避免使用 jquery 进入 DOM,但如果没有其他更改,我会这样做。

提前谢谢你。

此致

我已经通过以下步骤解决了:

后端

添加了一个名为“时间”的字段(或您希望使用的任何字段),每当您检测到结束日期进入第二天时,您将“时间”设置为“23-59”。

前端

将以下代码添加到您的 Fullcalendar init 中:

    eventRender: function(eventObj, $el) {                    
        if (eventObj.time == "23-59") {
            $($el).css({"overflow":"inherit","height":"50px"});                            
        }
    },
    eventAfterAllRender : function (view) {
        if (view.type == 'agendaDay') {                        
            $(".fc-agendaDay-view .fc-slats table tbody").append('<tr>\
            <td class="fc-axis fc-time fc-widget-content" style="height:100px"></td>\
            <td class="fc-widget-content">&nbsp;</td>\
            </tr>');
        }                    
    }

这不是 v3 的优雅解决方案,但它符合我的要求。