Question

我正在使用jQuery weekcalendar plugin来显示包含活动的基于网络的日历。如何使非工作时间变灰？当它不在工作时间时，整行应该是灰色的：

businessHours: {start: 8, end: 19, limitDisplay: false},

Answer 1

首先，您需要在工作时间使用全局变量，如下所示：

var timeStart = 8
var timeEnd = 19

businessHours: {start: timeStart , end: timeEnd , limitDisplay: false},

然后，尝试将此添加到文档就绪的jquery javascript（创建日历之后）：

$('.wc-time-slot').each(function(index, element) {
    if (index<6*timeStart||index>=6*timeEnd) {
        $(this).css('background-color','#eee')
    }
});

每小时有六行，所以这就是你乘以6的原因。

Answer 2

编辑：答案不完整。它没有突出显示整行。

感谢Phekka，我在Inspect元素部分找到了这个：

非业务时间：

<div class="wc-hour-header ui-state-default"></div>

商务时间：

<div class="wc-hour-header ui-state-active wc-business-hours"></div>

Answer 3

这有点难。我认为你必须管理 td.wc-day-column背景属性，并添加css3 gradient 计算像素或百分比值。

祝你好运。

在jQuery周日历插件中淡出非工作时间

3 个答案: