并排放置FullCalendar事件.限制均匀大小为10px x 10px

Question

我想知道是否有一个很好的方法来定位FullCalendar事件，如果它们是浮动的。在可用的水平空间被填满后，它们将垂直堆叠。这看起来没有问题，因为事件的大小也将限制为10px x 10px。

我明白我需要改变left:和top:的CSS属性。

而不是像这样:

======== -> 事件
======== -> 事件

它看起来像这样:

[--][--] ->事件^事件

我在哪里可以使FullCalendar.js的变化?

Answer 1

你需要修改renderSlotSegs函数;代码:

if (levelI) {
    // indented and thin
    outerWidth = availWidth / (levelI + forward + 1);
}else{
    if (forward) {
        // moderately wide, aligned left still
        outerWidth = ((availWidth / (forward + 1)) - (12/2)) * 2; // 12 is the predicted width of resizer =
    }else{
        // can be entire width, aligned left
        outerWidth = availWidth;
    }
}

应改为:

if (levelI) {
    // indented and thin
    outerWidth = availWidth / (levelI + forward + 1);
}else{
    if (forward) {
        // changed to limit width of first overlapping slot
        outerWidth = availWidth / (forward + 1);
    }else{
        // can be entire width, aligned left
        outerWidth = availWidth;
    }
}

Answer 2

在var R,V=la+"-widget-header",ea=la+"-widget-content"附近的.min版本中，您有以下代码:

R="<table class='fc-border-separate' style='width:100%' cellspacing='0'><thead><tr>";for(aa=0;aa<F;aa++)R+="<th class='fc- "+V+"'/>";R+="</tr></thead><tbody>";for(aa=0;aa<w;aa++){R+="<tr class='fc-week"+aa+"'>";for(V=0;V<F;V++)R+="<td class='fc- "+ea+" fc-day"+(aa*F+V)+"'><div>"+(I?"<div class='fc-day-number'/>":"")+"<div class='fc-day-content'><div style='position:relative'>&nbsp;</div></div></div></td>";R+="</tr>"}R+="</tbody></table>";

您是否尝试编辑此部分。

几个月前为我工作过