2

我正在努力做到这一点，以便当您将鼠标放在我日历中的某个事件上时，它会改变颜色。我可以做到这一点并且它有效，但是事件是不同的颜色，我只知道如何使事件变回一种颜色，不超过一种。因此，即使我有红色、蓝色和绿色事件，它们也只会在您将鼠标悬停在它们上方时变为红色。我只希望 ID 为“rto”的事件变为红色，那么我将如何实现呢？

<script type='text/javascript'>

$(document).ready(function() {

     var cal = $('#calendar')

   cal.fullCalendar({
    eventSources: [

        {
            url: "...",
            borderColor: 'green',
            id: "events",
        },
        {
            url: "...",
            borderColor: 'red',
            id: "rto",
        },
        {
            url: "...",
            borderColor: 'blue',
            id: "goals",
        },
                    ],

eventMouseover: function(){

            $(this).css('border-color', 'orange');

        },
eventMouseout: function() { 

            $(this).css('border-color', 'red');

        }
    }); 
});

这就是你使用函数的方式： function( event, jsEvent, view ) { }

4

1 回答 1

2

我建议不要直接设置样式，而是在 eventMouseover 回调中添加一个 css 类，然后在 eventMouseout 处理程序中删除它。

Javascript：

eventMouseover: function (event, jsEvent, view) {
    jQuery(this).addClass("current_entry");
},
eventMouseout: function (event, jsEvent, view) {
    jQuery(this).removeClass("current_entry");
},

CSS：

#calendar .current_entry
{
    border-color: #ff0000;
    border-width: 4px;
    z-index: 100 !important;
}

其中“日历”是您的日历容器元素的 ID

于 2013-08-15T11:32:50.060 回答