【问题标题】:How do I stop FullCalendar.js from squishing vertically on mobile?如何阻止 FullCalendar.js 在移动设备上垂直挤压?
【发布时间】:2019-09-24 23:53:36
【问题描述】:

在移动设备上查看 dayGridMonth 视图时,挤压会导致日历启用滚动条供您筛选。

我希望高度保持完整,只有宽度可以动态调整大小,这样您只需要滚动页面而不是实际的日历本身(因为您已经必须在页面上滚动一些,很尴尬)。标题看起来也不太热,但现在的焦点实际上是日历本身。

我的 CSS 一开始就很弱,但是使用库的样式是十倍的吓人。任何正确方向的提示将不胜感激。下面是滚动的示例(强制光标,否则栏会消失)

从技术上讲,移动设备可能需要切换到周视图甚至日视图,这可以快速轻松地解决它,但我设置它的人真的很喜欢完整的月视图,并希望它在所有媒体格式中保持不变是。

我找到了整个容器的元素,但弄乱高度或宽度似乎无济于事,我不明白为什么。

感谢您的帮助

【问题讨论】:

  • 有 API 选项可以帮助解决这个问题 - 请参阅 fullcalendar.io/docs/sizing。使用它们可能比自己乱搞 CSS 更可靠、更易于维护。附: fullCalendar 并没有真正针对移动设备进行优化,正如您已经开始发现的那样
  • 呃,我不知道为什么我没有想到咨询文档,我没有意识到除了内容和行为之外,他们还有操作视图的功能。谢谢!

标签: javascript css fullcalendar fullcalendar-4


【解决方案1】:

有两个元素容器处理整个盒子内容,我正在编辑外部容器,但内部容器也需要扩展,因为它是填充表格/行的容器。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-10-21
    • 1970-01-01
    • 1970-01-01
    • 2017-03-08
    • 2019-01-13
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多