2

我正在扩展一个日程安排应用程序,该应用程序在议程日视图中显示多个完整日历,以显示多人当天的日程安排。让每个 Fullcalendar 使用自己的滚动条已被拒绝;因此,所有日历都以全长显示,并在周围的 div 中设置了一个滚动条。

现在的问题是让标题在垂直滚动期间保持固定。扩展标题功能还有其他要求(附加数据、图标、链接等),因此在每个 Fullcalendar div 上方创建自己的标题对我来说更有意义。

使用 CSS 并正确放置 div,我能够让日历与标题分开垂直滚动,从而实现“固定标题”效果。然后问题是水平滚动:如果我让 div 水平向外延伸,那么包含日历的 div 的垂直滚动条一直向右,超出可见性。

我还尝试了固定标题的插件,方法是使用带有任意文本的标题设置,然后将 Fullcalendar div 放在单行中的元素内。这些都以不同的方式失败(隐藏日历,重新打印标题,其他方式)。

这是基本设置:http: //jsfiddle.net/jzqJC/。我正在寻找如何使主要内容区域具有(1)必要时垂直和水平滚动条,(2)在垂直滚动时保持列标题固定的方向,以及(3)同步列标题的水平滚动和它们下面的日历。我花了几天时间根据 stackoverflow 和谷歌搜索来修补和尝试一些东西,但我很茫然,需要帮助。请指教。

[附带问题:如何在小提琴中链接到 fullcalendar.min.js?我是否需要文件的公共 URL 并将其添加为资源?如果是这样,将该文件放在公共 URL 中的最佳方式是什么?]

谢谢,
J

4

1 回答 1

1

我创建了这个小提琴,看看它是否是你要找的:http: //jsfiddle.net/7NgUB/

我将 .headerItem,.calendarItem 显示更改为内联,并将 #headerRow,#calendarRow 位置更改为 CSS 中的绝对位置。

然后一切都用jquery完成:

指定#headerRow,#calendarRow 宽度为其子项的总宽度,设置#calendarRow 顶部位置显示在#headerRow 下方,每次滚动#content 时更改#headerRow 顶部位置

于 2012-06-20T14:40:24.863 回答