Jquery Tam takvim ve dinamik etkinlik renkleri

Question

jquery fullcalendar için json etkinlik kaynağım aracılığıyla etkinliklerin renklerini iletmek istiyorum, bunu nasıl başarabilirim?

Answer 1

Bundan daha kolay bir şey yok. JQuery Fullcalendar Event Colors belgelerini kontrol ederseniz, her olay nesnesi için belirtebileceğiniz bir className parametresi olduğunu görürsünüz. Bu parametrenin içeriği, etkinliklere sınıf olarak eklenir ve böylece yalnızca eşleşen ada sahip css'yi belirtmeniz gerekir.

olaylar event1 hızlı bir örnek için buraya http://jsbin.com/ijasa3/96 farklı

.custom, 
.custom div, 
.custom span { 
    background-color: green; /* background color */ 
    border-color: green;  /* border color */ 
    color: yellow;   /* text color */ 
} 

kontrol görünmesi için

[ 
    { 
    title  : 'event1', 
    start  : '2012-06-10', 
    className : 'custom', 
    }, 
    { 
    title : 'event2', 
    start : '2012-06-05', 
    end : '2012-06-07' 
    }, 
    { 
    title : 'event3', 
    start : '2012-06-09 12:30:00', 
    allDay : false 
    } 
] 

CSS (EVENT1 üzerinde className parametrenin dikkat). Event1'in arka plan olarak yeşil ve metin rengi olarak nasıl sarı olduğunu unutmayın.

---

bu satırlar boyunca gidebiliriz jQuery Fullcalendar Event Colors açıklanan seçenekleri kullanarak başka uygulanabilir bir yol:

$('#calendar').fullCalendar({ 
... 
    eventSources: [ 
    //a full blown EventSource-Object with custom coloring 
    { 
     events: [ 
     { 
      title  : 'event1', 
      start  : '2012-06-10' 
     } 
     ], 
     backgroundColor: 'green', 
     borderColor: 'green', 
     textColor: 'yellow' 
    }, 
    //a normal events-array with the default colors used 
    [ 
     { 
     title : 'event2', 
     start : '2012-06-05', 
     end : '2012-06-07' 
     }, 
     { 
     title : 'event3', 
     start : '2012-06-09 12:30:00', 
     allDay : false 
     } 
    ] 
    ], 
    ... 
}); 

http://jsbin.com/ijasa3/99

Answer 2

: Başka bir renk ihtiyaç olaylar için

kullanılması farklı Eventsources

Sürüm 1.5'e yükseltirseniz, bunun işe yaramadığını görebilirsiniz. Çözelti her olay textColor, backgroudColor ve BorderColor ayarlayabilirsiniz sürüm 1.5 ile stil

.fc-event-skin { } 

Answer 3

dışarı yorum yapmak gibi görünüyor.

Answer 4

Daha iyi bir görünüm elde etmek için, EventObject'un backgroundColor'unu kullanmak daha iyidir.