Home FullCalendar How to change day background-color in fullcalendar for particular date?

How to change day background-color in fullcalendar for particular date?

by therichpost
8 comments
fullcalendar

Hello to all, welcome to therichpost.com. In this post, I will tell you, How to change day background-color in fullcalendar for particular date?


fullcalendar is the best A JavaScript event calendar. Customizable and open source.
In this post, we will change full day background-color in fullcalendar for particular date.
I am sharing this post because I personally like this trick very much that is why.

I am changing of day color which will come in today date.

Here is the working code for change day background-color in fullcalendar for particular date

dayRender: function(date, cell) {
                var today = $.fullCalendar.moment();
                var end = $.fullCalendar.moment().add(7, 'days');

                if (date.get('date') == today.get('date')) {

                    cell.css("background", "#e8e8e8");

     }
}

There are so many tricks in fullcalendar and I will let you know all. Please do comment if you any query related to this post. Thank you. Therichpost.com

You may also like

8 comments

Julien Pitt November 14, 2019 - 10:19 am

Great

Reply
Ajay Malhotra June 9, 2020 - 2:00 pm

Thank you

Reply
mm June 9, 2020 - 10:51 am

how to change the color of a cell by clicking thank you

Reply
Ajay Malhotra June 9, 2020 - 2:01 pm

You can use cell click event.

Reply
Karamjit Singh Sedhev July 8, 2020 - 10:59 am

how to show empty cell as red except sundays,2 saturdays and yearly holidays.

Reply
Ajay Malhotra July 8, 2020 - 11:42 am

Will update you soon.

Reply
Xa4 January 5, 2023 - 1:51 pm

Can you please describe more how to use dayRender in react js functional component?

Reply
therichpost January 6, 2023 - 11:43 am

Please clear your query more briefly first, thanks.

Reply

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.