time - Jquery FullCalendar 事件时隙悬停方法

标签 time hover fullcalendar

我已经启动并运行了 FullCalendar,它非常好。我的问题是如何最好地实现时隙悬停功能。如果用户可以在他们悬停的任何给定时间段上获得视觉提示,那将是非常好的。

我找到了以下链接http://code.google.com/p/fullcalendar/issues/detail?id=269这提供了一种解决方案,该解决方案在议程单元格行中添加了一个新结构,以便提供对单个单元格的访问。但是,表明此解决方案将导致 FullCalendar 变得迟缓。

在我开始研究 FullCalendar 代码之前,我想我会问其他人是否有任何想法或解决方案。

我对接近这个的想法如下:

  • 将占位符事件添加到每个时间段。用户不会看到这些事件,但这些不可见的事件可用于允许“悬停”标记。我在这里担心的是,添加额外的事件会导致 FullCalander 变得迟缓。此外,拖放功能可能会受到影响。
  • FullCalender 可以确定用户单击的时间段。是否可以使用获取时间段单击的代码来为悬停突出显示提供引用?
  • 其他?

  • 我正在考虑将选项 2 作为开始的地方。但是,如果有人对可行的解决方案有其他想法,我会很高兴听到。

    如果我想出一个解决方案,我会在这里发布。

    谢谢,

    吉姆

    这是 FullCalendar 网站的链接:http://fullcalendar.io/
    我发现使用它非常好。

    最佳答案

    下面的代码对我有用。

    $('.ui-widget-content').hover(function(){
        if(!$(this).html()){    
            for(i=0;i<7;i++){
                $(this).append('<td class="temp_cell" style="border: 0px; width:'+(Number($('.fc-day').width())+2)+'px"></td>');
            }
    
            $(this).children('td').each(function(){
                $(this).hover(function(){
                    $(this).css({'background-color': '#ffef8f', 'cursor': 'pointer'});
                },function(){
                    $(this).prop('style').removeProperty( 'background-color' );
                });
            });
        }
    },function(){
        $(this).children('.temp_cell').remove();
    });
    

    确保在实例化日历的代码之后添加它,如果 JQuery 日历的 defaultView 属性是“AgendaWeekly”,它应该按原样工作。

    干杯,

    关于time - Jquery FullCalendar 事件时隙悬停方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10056107/

    相关文章:

    fullcalendar - Yii - FullCalendar - 如何设置时区?

    javascript - 在全日历中点击编辑事件

    PHP - 等待 2 小时执行查询

    jquery - jQuery 悬停功能超时

    git - 使用 JGit 确定给定分支的创建时间

    css - <a> 在悬停时启动不希望的悬停效果。这是怎么回事,有办法阻止吗?

    javascript - 将鼠标悬停在一个类(class)上会影响页面上同一类(class)的所有其他类(class)

    javascript - 将事件呈现为禁用字段

    C++ 日期和时间,带毫秒

    time - 为什么自适应 AUTOSAR 需要 TSync(时间同步)?