Clear the fullcalendar background

2

I'm using fullcalendar for a system where the user clicks on a day to bookmark a calendar. I need to leave the background of the day clicked with a certain color and this I found in the documentation how to do and is simple even, my problem here is when the user clicks on a second day, and with that the first day clicked should "delete" the background color and leave only the second day.

I even did it, but I guess not in the best way, if someone knows a better way to do that.

$(document).ready(function() {
    var opt = {
            dayClick : function(date, allDay, jsEvent, view) {

            // seta todo background-color como branco
            $('.fc-view-month > table > tbody > tr > td').css('background-color', '#fff');

            // seta o background-color do dia clicado como vermelho
            $(this).css('background-color', 'red');
        }
    };

    $('.calendar').fullCalendar(opt);

});  

Example in jsfiddle

    
asked by anonymous 02.05.2014 / 14:51

1 answer

4

Your solution is correct. I add another one that is preferable, for using classes instead of applying CSS directly to the element.

// Remove todo background do calendário
$('.fc-view-month > table .selecionado').removeClass('selecionado');

// Adiciona a classe "selecionado" ao dia clicado
$(this).addClass('selecionado');

and CSS:

.selecionado {
    background-color: #f55;
    transition: background-color 80ms linear; # Isto é só para suavizar o aparecer 
                                              # e desaparecer do fundo
}

Example

    
02.05.2014 / 15:50