无法让jquery fullcalendar事件正确着色 [英] Can't get jquery fullcalendar events to color correctly

问题描述

我尝试从 FullCalendar主页复制完全相同的代码。所以我有︰

  $（document）.ready（function（）{
 
 var date = new Date（）; 
 var d = date.getDate（）; 
 var m = date.getMonth（）; 
 var y = date.getFullYear（）; 
 
 $（'＃calendar'）。fullCalendar（{
 header：{
 left：'prev，next today'，
 center：'title'，
 right：' month，agendaweek，agendaDay'
}，
 editable：true，
 events：[
 {
 title：'All Day Event'，
 start： new Date（y，m，1）
}，
 {
 title：'Long Event'，
 start：new Date（y，m，d  -  5），
 end：new Date（y，m，d  -  2）
}，
 {
 id：999，
 title：'重复事件'，
开始：新日期（ y，m，d  -  3，16，0），
 allDay：false 
}，
 {
 id：999，
 title：'重复事件'， 
 start：new Date（y，m，d + 4,16,0），
 allDay：false 
}，
 {
 title：'Meeting'， 
 start：new Date（y，m，d，10，30），
 allDay：false 
}，
 {
 title：'Lunch'，
 start：new Date（y，m，d，12，0），
 end：new Date（y，m，d，14，0），
 allDay：false 
} ，
 {
 title：'Birthday Party'，
 start：new Date（y，m，d + 1,19,0），
 end：new Date（y， m，d + 1，22，30），
 allDay：false 
），
 {
 title：'Click for Google'，
 start：new Date（y，m，28），
 end：new Date（y，m，29 ），
 url：'http://google.com/'
} 
] 
}）; 
 
}）; 
  

我已验证我的网站正确包含 fullcalendar.css 和 fullcalendar.print.css 。

但是，我的页面显示为：

http：//dl.dropbox。 com / u / 6753359 / badcalendar.PNG

注意我的事件不像他们的例子那样是蓝色的。我试着在事件中设置 color 属性，我试着给事件一个 className ，没有任何东西让我的事件有颜色。

---

编辑： b $ b当我检查我的全天事件事件时，我以下divs：
http://dl.dropbox.com/u /6753359/badcalendarEventElement.PNG

至于使用的风格，Chrome显示了我：

http://dl.dropbox.com/u/6753359/badcalendarCss.PNG

---

有谁知道我该如何解决这个问题？

解决方案

尝试添加media =print

 < link rel =stylesheet href =fullcalendar.print.csstype =text / cssmedia =print/> 
  

您的打印样式表正在覆盖您的屏幕样式表。

I tried copying the exact same code from the FullCalendar Homepage. So I have:

$(document).ready(function () {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        events: [
                {
                    title: 'All Day Event',
                    start: new Date(y, m, 1)
                },
                {
                    title: 'Long Event',
                    start: new Date(y, m, d - 5),
                    end: new Date(y, m, d - 2)
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d - 3, 16, 0),
                    allDay: false
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d + 4, 16, 0),
                    allDay: false
                },
                {
                    title: 'Meeting',
                    start: new Date(y, m, d, 10, 30),
                    allDay: false
                },
                {
                    title: 'Lunch',
                    start: new Date(y, m, d, 12, 0),
                    end: new Date(y, m, d, 14, 0),
                    allDay: false
                },
                {
                    title: 'Birthday Party',
                    start: new Date(y, m, d + 1, 19, 0),
                    end: new Date(y, m, d + 1, 22, 30),
                    allDay: false
                },
                {
                    title: 'Click for Google',
                    start: new Date(y, m, 28),
                    end: new Date(y, m, 29),
                    url: 'http://google.com/'
                }
            ]
    });

});

I have verified that my site correctly includes the fullcalendar.css and fullcalendar.print.css.

However, my page comes up as:

http://dl.dropbox.com/u/6753359/badcalendar.PNG

Notice my events are not blue like their examples. I tried setting the color property in the events, I tried giving the events a className, nothing is making my events have color.

---

Edit: When I inspect my "All Day Event" event, Chrome shows me the following divs: http://dl.dropbox.com/u/6753359/badcalendarEventElement.PNG

And as far styles being used, Chrome shows me:

http://dl.dropbox.com/u/6753359/badcalendarCss.PNG

---

Does anyone know how I can fix this?

解决方案

try adding media="print"

<link rel="stylesheet" href="fullcalendar.print.css" type="text/css" media="print" />

your print style sheet is overriding your screen style sheet.

这篇关于无法让jquery fullcalendar事件正确着色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！