Wie ich Termine ändern hintergrund-Farbe mit verschiedenen Farben, in fullcalendar?

Ich bin mit der letzten version von fullcalendar, schaute ich auf die Dokumentation, wie ändern der Hintergrundfarbe der Fall, aber ich weiß nicht, wie Sie machen verschiedene Veranstaltungen.
Ich brauche für den code-Beispiel mit Veranstaltungen, rot, blau, grün, wie die Abb.

Wie ich Termine ändern hintergrund-Farbe mit verschiedenen Farben, in fullcalendar?

Sehe ich in diesem code, auf der Dokumente-Seite, aber ich kann Sie nicht anwenden, 2 Farben:

    $('#calendar').fullCalendar({
        editable: true,             events: [
            {
                title: 'Teste1',
                start: new Date(y, m, d, 10, 30),
                allDay: false,
                 editable: false
            },
            {
                title: 'Teste2',
                start: new Date(y, m, d, 11, 40),
                allDay: false
            }           ], eventColor: '#378006'        });

InformationsquelleAutor claudioprv | 2011-04-14

  1. 24

    Da Sie über die neueste version (1.5), können Sie die backgroundColor Eigenschaft.

    {
  title: 'Teste1',
  start: new Date(y, m, d, 10, 30),
  allDay: false,
  editable: false,
  backgroundColor: '#SomeColor'
},
{
  title: 'Teste2',
  start: new Date(y, m, d, 11, 40),
  allDay: false,
  backgroundColor: '#SomeOtherColor'
}

    Können Sie auch die textColor Eigenschaft, wenn Sie brauchen, um zu ändern, wie gut.

    InformationsquelleAutor Brandon

  2. 6

    Verwendung von css und der className-Eigenschaft.

    <style>
.event {
    //shared event css
}

.greenEvent {
    background-color:#00FF00;
}

.redEvent {
    background-color:#FF0000;
}
</style>

<script>
$('#calendar').fullCalendar({
      editable: true,             events: [
          {
              title: 'Teste1',
              start: new Date(y, m, d, 10, 30),
              allDay: false,
                editable: false,
              className: ["event", "greenEvent"]
          },
          {
              title: 'Teste2',
              start: new Date(y, m, d, 11, 40),
              allDay: false,
              className: ["event", "redEvent"]
          }           ], eventColor: '#378006'        });
</script>

    InformationsquelleAutor Matt MacLean

  3. 0

    Ich habe die Farbe code, wie dies für jedes event, Es funktioniert für mich. 

     $.each(data, function(i, v){    
    var event =[];     
    var col = "";           
                            if(v.Status == 1)      
                            {  
                                col = "#00c0ef";  
                            }  
                            else if(v.Status == 2){  
                                col = "#dd4b39";  
                            }     
                            else if (v.Status === 3)  
                            {    
                                col = "#f39c12";   
                            }       
                            else {   
                                col = "#00a65a";  
                            }    
                         event.push({   
                             title: v.AssignedName + "\n  Installation Date: \n" + da,    
                             start: da,    
                             backgroundColor: col,    
                                textColor:'black'       
                         })   
});

    InformationsquelleAutor Gobind Gupta

Schreibe einen Kommentar