Question

48

How do I change an event's background color with different colors, in fullcalendar?

rated 0 times [ 53] [ 5] / answers: 1 / hits: 44972 / 13 Years ago, thu, april 14, 2011, 12:00:00

I'm using the last version of fullcalendar, I looked on documentation how change background color event, but I don't know how make to different events.

I need for code sample with events red, blue, green, like the following picture:

enter

I see this code, on document site, but I can't to apply 2 colors:

$('#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'

});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

deanna

Add To Favorites

Follow

Total Points: 84

Total Questions: 86

Total Answers: 107

Location: Cyprus

Member since Wed, Dec 8, 2021

3 Years ago

deanna questions

1 CastError: Cast to ObjectId failed for value XXXXXXXXXX (type string) at path _id for model XXXX

Thu, Apr 21, 22, 00:00, 2 Years ago

1 Next.js behavior on back button pressed

Mon, Sep 6, 21, 00:00, 3 Years ago

1 React-Router + Typescript error while wrapping component with Router No overload matches this call

Sat, Feb 13, 21, 00:00, 3 Years ago

1 Use the webpack asset module with a custom output filename

Sun, Jan 17, 21, 00:00, 3 Years ago

1 React js random color

Sun, Nov 15, 20, 00:00, 4 Years ago

View All

answered 13 Years ago yesseniadajab · Accepted Answer

Since you are using the latest version (1.5), you can set the backgroundColor property.

{

  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'

}

You can also set the textColor property if you need to change that as well.