如何解决是否可以在FullCalendar中交替显示行背景颜色?
| 我将一个奇/偶类应用于fc-议程插槽tr \,但是问题是左/右\“ cell \”边框位于下面的fc-议程日表上,所以它\'当我在fc议程插槽tr上设置背景时,未显示。 FullCalendar本身是否有允许交替行颜色的选项,还是有人找到了在FullCalendar之外进行此操作的方法?解决方法
我相当确定没有解决此问题的方法。
问题的根源在于周视图的结构,这可以说是对标记的广泛滥用。它基本上是一个具有列的表,然后该表具有一个与表重叠的表,该表具有行。没有单独的单元格让您只能控制单数行和单列。当您为行着色时,您隐藏了列边框,这是无意间造成的。据我所知,这要么是插件的设计决定,要么是主要的疏忽。
在日视图中,这不是问题,因为您只有一列。
, 有点晚了,但是将它添加到您的CSS中
.fc-agenda-slots tr.d1 td {
background-color: rgba(79,129,128,.2); color: black;
}
并在您的JS中执行,以在您渲染日历后立即执行。
$(\"table tr\").each(function () {
var i = $(\"table tr\").index($(this));
if (i % 4 == 1 || i % 4 == 2)
$(this).addClass(\"d1\");
});
顺便说一句,这仅适用于周视图。
, 我遇到了同样的问题,我采用了这个技巧:
您可以在该行的cssClass上使用不透明度属性。
.fc-议程插槽tr:nth-child(4n + 1)td,.fc-议程插槽tr:nth-child(4n + 2)td {
背景颜色:#E7F3F4;
不透明度:0.5;
}
.fc-agenda-slots tr:nth-child(4n-1) td,.fc-agenda-slots tr:nth-child(4n) td {
background-color:#F3F9FA;
opacity:0.5;
}
这将显示单元格的边界,但仅使单元格背景色不透明。
它不是有史以来最好的解决方案,但是如果您没有强大的图形约束,那么就足以使您满意!
干杯
, 使用
slots = $element.find(\'.fc-agenda-slots tr\');
我能够获得周视图中的行,然后再进行特定的课程。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。