Question

我正在使用fullcalendar和qtip插件我有不同颜色的活动。我需要做的就是拥有一个与完整日历事件的颜色相对应的工具提示。我希望qtip（工具提示）颜色根据事件颜色而变化这可能吗？
谢谢.. :)）

enter image description here

这是我qtip的代码

    eventRender: function (event, element) {
        element.qtip({
            content: {
                title: { text: event.title },
                text: '<span class="title" style="font-weight:bold;">Start: </span>' + ($.fullCalendar.formatDate(event.start, 'hh:mmtt')) +
                    '<br><span class="title" style="font-weight:bold;">End: </span>' + ($.fullCalendar.formatDate(event.end, 'hh:mmtt')) +
                    '<br><span class="title" style="font-weight:bold;">Where: </span>' + event.location +
                    '<br><span class="title" style="font-weight:bold;">Description: </span>' + event.description
            },
            position: {
                adjust: { screen: true },
                corner: { target: 'bottomMiddle', tooltip: 'topLeft' }
            },
            show: {
                solo: true, effect: { type: 'slide' }, effect: function () {
                    $(this).fadeTo(200, 0.8);
                }
            },
            hide: { when: 'mouseout', fixed: true },
            style: {
                tip: true, // Give it a speech bubble tip
                border: {
                    width: 2,
                    radius: 5,
                    color: '#474968'

                },
                title: {
                    color: '#fff',
                    background: '#9193c4'
                },
            }
        });
    }

Answer 1

事件对象接受className属性。您可以使用它来使用CSS为事件着色（例如应用“假日”类）。在您的eventRender回调中，您可以检查此类是否存在（if（event.className ==='holiday'）...）并适当地为您的工具提示着色

FullCalendar事件颜色为qtip

1 个答案: