Saltar al contenido

Fullcalendar: cambia el color para días específicos

Te sugerimos que revises esta solución en un ambiente controlado antes de enviarlo a producción, un saludo.

Solución:

por las vistas month, basicWeek y basicDay puede cambiar la representación de los días proporcionando un dayRender función. P.ej:

$("#calendar").fullCalendar(
    dayRender: function (date, cell) 
        cell.css("background-color", "red");
    
);

la documentación para dayRender está disponible aquí: http://arshaw.com/fullcalendar/docs/display/dayRender/

Y aquí hay un ejemplo de trabajo en jsfiddle: http://jsfiddle.net/kvakulo/CYnJY/4/

Para aquellos que buscan simplemente cambiar el color de las fechas pasadas, apunten .fc-past en tu css y agrega un background-color propiedad. P.ej,:

.fc-past 
    background-color: silver;

    dayRender: function(date, cell)
        if (moment().diff(date,'days') > 0)
            cell.css("background-color","silver");
        
    ,

Más adelante puedes encontrar las explicaciones de otros administradores, tú aún puedes insertar el tuyo si lo deseas.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *