个人中心
gpt4 book ai didi

javascript - 全日历 : minTime wrongly calculate fc-not-start

转载 作者：行者123 更新时间：2023-11-28 19:22:41 26 4
gpt4 key购买 nike

我正在使用 Fullcalendar 库，调度程序模块。

我使用 minTime 属性并将其设置为: View 定义内的“06:00:00”(这样“一天不是从午夜开始的”)。

但是当我这样做时，在 6h 之前开始的日历元素有一个类 fc-not-start 即使它们在日历的中间......

如何处理？

编辑:

一些附加信息:

全日历版本:v3.9.0

fc-not-start :此类应具有未在此 View 中启动的日历(预定)元素。 (开始是不可见的)。这是必需的，因为如果元素有一些圆 Angular ，边框，......如果开始不可见，它不应该在左侧。 (或者如果你想显示图标，你不是在看完整的元素)

例子:在红色方 block 内，这是对fc-not-start

的正确使用

enter image description here

这是对fc-not-start的错误使用

enter image description here

fc-not-start 应该在 fullcalendar 库中自行计算并且它正在工作，直到我在 View 中添加参数 minTime。

编辑 2:

我创建最少的代码来查看问题

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <link rel='stylesheet' href='css/fullcalendar.css' />
    <link rel='stylesheet' href='css/scheduler.css' />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link rel='stylesheet' href='css/style.css' />
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>

    <div id='calendar'></div>



    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
    <script src='js/moment.js'></script>
    <script src='js/fullcalendar.js'></script>
    <script src='js/scheduler.js'></script>
    <script src='js/my_script.js'></script>

    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>




</body>
</html>

JS

var resources = [
    {
        id: 'A',
        title: 'A',
        sortOrder: 1
    },
    {
        id: 'B',
        title: 'B',
        sortOrder:2
    },
    {
        id: 'C',
        title: 'C',
        sortOrder:3
    }
];


$('#calendar').fullCalendar({


    // height: 550,
    // eventColor: '#428bca',

    schedulerLicenseKey: 'CC-Attribution-NonCommercial-NoDerivatives',
    defaultView: 'timelineFourDays',

    views: {
        timelineFourDays: {
            type: 'timeline',
            minTime: '07:00:00',
            duration: { days: 4 }
        },
    },

    resources: resourcesFunc,



    nowIndicator: true,




    events: [
        {
            id: '1',
            resourceId: 'A',
            title: 'Meeting',
            start: '2019-07-13T00:20:00',
            end: '2019-07-14T02:20:00',
        },

        {
            id: '2',
            resourceId: 'A',
            title: 'Meeting2',
            start: '2019-07-13T00:20:00',
            end: '2019-07-14T02:20:00',
        }


    ],
    displayEventTime: true,


});


function resourcesFunc(callback) {
    callback(resources);
}

enter image description here

只有当元素在屏幕上不完全可见时才应该使用 <。在这种情况下，这个类被错误地计算了...

https://jsfiddle.net/Ly9rsoc1/2/

最佳答案

你说

"The < should be only if the element is not whole visible on screen"

但是:您的事件在指定的 minTime 之前开始值(value)。这意味着事件的起点永远不会在您的日历上显示。因此 <显示图标。

我认为您误解了此功能的性质。这与 HTML 元素 的开始是否可见无关，而是与事件(由该 HTML 元素表示)的开始是否可见有关。由于您从显示中删除了该事件涵盖的一些时间，因此它会显示图标，以便用户清楚地了解这一事实。

总而言之:日历的行为完全符合预期。这里没有错误。

顺便说一句，我要指出的是，如果您经常有涵盖一天中这些时间的事件，那么在我看来，让这些时间不可见不是很合乎逻辑或对用户非常友好，因为它隐藏了可能有用的内容信息。但是，如果这些特定事件是异常事件，并且您的大部分事件发生在早上 7 点之后，那么您可能只需要将这些事件作为异常情况来容忍。

关于javascript - 全日历 : minTime wrongly calculate fc-not-start，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56987348/

26 4 0
文章推荐： ios - 在中心 Cocos2d 中触摸时停止 Sprite 动画
文章推荐： python - 使用 loffset 对 pandas DataFrame 重新采样会引入一个小时的额外偏移量
文章推荐： ios - 保存 NSNumber 核心数据
文章推荐： python - 思想树冠 : Issue Using pyhdf to read and HDF4 file
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com