如何解决要内联显示的 Daygrid (FullCalendar) 事件
我使用 DayGrid 在我的网站上显示每月的日历,其中每天都显示事件。当同一天有多个事件时,我希望事件显示为同一行中的图标(例如,当天将三个事件显示在同一行中),而不是每个事件都在不同的新行上。我用 css 尝试了很多东西,但它似乎不起作用。任何建议都会有所帮助,谢谢
示例:
我使用过这个 CSS,但是 inline-block
属性将所有事件分配到一周的第一天,所以我找不到合适的解决方案
a.fc-event { width: 15px; }
div.fc-content-skeleton > table > tbody > tr { display: inline-block; }
解决方法
您在“dayGridMonth”视图中看到的网格实际上是由一个 HTML 表格组成的,表格的行跨越每周的整组天数。因此,如果您内联这些行,它们将尽可能地向左移动。
每天都没有单独的网格(这只是一种视觉效果)。如果您将鼠标悬停在浏览器的开发者工具中,元素检查器会为您突出显示这些行,以便您可视化结构。
如果不完全重写绘制该网格的 fullCalendar 中的底层源代码,您所要求的内容是不可能的。
您唯一的选择是创建一个 custom view,也许通过从 fullCalendar 的 GitHub 存储库克隆 dayGrid 代码并根据您的需要重新编写它,但除非您已经熟悉可能成为相当重要的任务,而不是轻而易举的事情 - 除非您有很多时间并准备投入大量精力以获得相对较小的 UX 奖励。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。