I am using FullCalendar component and I need to color the weekends ,Friday & Saturday. I have used the following as recommended here: Can I set a different color for the weekend on monthly fullCalendar display
$('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');
I added as well the css class.
Here is me code that doesn't color the weekends ... Any advise!
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$.getJSON('[@spring.url '/loadSomeData'/]', function (data) {
$.getJSON('[@spring.url '/loadOtherData/]', function (info) {
information = returnedPublicVacation;
var calendar = $('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: true,
select:
function(start, end, allDay) {
vacationStart = start;
showTheCorrectDialog(vacationStart);
},
eventClick: function(calEvent, jsEvent, view) {
showTheCorrectDialog(calEvent.start);
// change the border color just for fun
$(this).css('border-color', 'red');
},
editable: true,
events:data.concat(information)
});
resourceVacation = data;
});
});
$('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');
});
Did you add style to the class in your css file?
You might also try this:
.fc-fri { color:blue; }
.fc-sat { color:red; }
(or .fc-sun for Sunday) You can see the example here: http://jsfiddle.net/rajesh13yadav/nf9whojL/1/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With