悬停在agendaWeek + fullcalendar的一个单元格上的效果

Question

嗨,我正在使用Adam Shaw的FullCalendar(http://arshaw.com/fullcalendar/).我正在使用一个月和AgendaWeek视图.当用户将鼠标悬停在月视图中的日期或者在AgendaWeek视图中的时间段时,我想放置悬停效果.我试着改变css如下:

.fc-widget-content:hover {
        background-color: red;
    }

这适用于月视图.文件附件

但是,当我只需要突出显示一个时隙时,相同的代码会在agendaWeek视图中选择整行.

下面的示例图片显示了每天下午1:00的时段,而不是仅仅是02-01星期三中鼠标光标所在的时段.

任何想法如何实现这一目标.

非常感谢.

Answer 1

这不是仅用 css 就能实现的。问题在于，周网格是通过将两个表格叠加在一起创建的，两个表格都没有背景，因此给人一种网格的印象，但不是真正的网格。网格的纵向部分是较高的 z-index，因此它将始终出现在顶部，因此不会针对该高度触发任何悬停事件。我尝试了各种方法来欺骗用户看到该框被突出显示，但是，如果无法知道您在网格中的垂直位置，这实际上是不可能的。这可能是可以用 jquery 完成的事情，但我认为所涉及的努力是不值得的。