Personnaliser l'affichage de l'affichage Mois avec FullCalendar

Question

J'ai changé l'étiquette className sur l'affichage quotidien et hebdomadaire de FullCalendar pour afficher l'état des éléments dans le calendrier.

Le problème est dans la vue mensuelle tous les événements ont le même style. Existe-t-il un moyen de remplacer cela avec une balise CSS personnalisée? J'ai essayé color, mais cela ne semble pas fonctionner.

Merci.

Answer 1

Veillez à utiliser un className distinct pour les événements que vous souhaitez voir apparaître séparément. EG:

events: [ 
    { 
     title: 'All Day Event', 
     start: new Date(y, m, 1), 
     className: 'Myevent_1' 
    }, 
    { 
     title: 'Long Event', 
     start: new Date(y, m, d-5), 
     end: new Date(y, m, d-2), 
     className: 'Myevent_2' 
    }, 
    ... ... 

restructurez les styles, comme si (au minimum):

.Myevent_1, .Myevent_1 .fc-event-skin { 
    background: gold; 
} 
.Myevent_2, .Myevent_2 .fc-event-skin { 
    background: red; 
} 

See a demo at jsFiddle.

Answer 2

Merci Brock ..

La question était i utilisé:

.subOpen, 
.fc-agenda .subOpen .fc-event-time, 
.subOpen a { 
    background-color:#FFFF33; 
    color: #000000; 
} 

J'ai effectivement mis à jour de FullCalendar 1.3 à 1.5.1 qui peut maintenant être passé ce qui suit dans le cadre de l'objet Even.

couleur, backgroundColor, BorderColor et textColor. Lorsqu'ils sont utilisés, ils remplacent le CSS dans fullCalendar.css et transmettent correctement les paramètres à toutes les vues. Donc, au lieu d'utiliser CSS, je passe les paramètres de couleur avec les données d'événement comme ça.

[{"title":"Thomas Trutt","start":"2011-05-30 09:00","end":"2011-05-30 22:00","id":"28","opID":"3","allDay":false,"color":"#36F"}] 

Cela fonctionne car tous mes événements sont extraits d'une base de données.

Merci encore