I have been looking for some code to use an image as a background for the events in fullcalendar (fullcalendar jQuery), but all I was able to find was code to add icons to said events.
I am looking to do something like this:
UPDATE: 2016-09-23 8:15 p.m. EST:
I have been trying with:
eventRender: function(event, element) {
$(element).find(".fc-day").css("background","url(https://www.mozilla.org/media/img/firefox/firefox-256.e2c1fc556816.jpg) no-repeat");
$(element).find(".fc-day").css("background-size","contain");
}
});
With no success so far, I'll keep looking to find what I am missing.
UPDATE: 2016-09-24 2:00 p.m. EST
Progression:
dayRender: function (date, cell) {
cell.css("background","url(https://www.mozilla.org/media/img/firefox/firefox-256.e2c1fc556816.jpg) no-repeat center");
cell.css("background-size","contain")
},
eventRender: function(event, element) {
$(element).css("opacity", "0.75");
}
});
Now I just need to find a way to change the background and opacity on specific events as the event will be stored in a MySQL database as I specified already in a comment (event with no picture should not have a background nor opacity).
You can do it with CSS as @madalin ivascu mentioned
https://jsfiddle.net/j49qtcge/
Using views other than 'month' may need different CSS though
I'm from the future writing =)
I tried this answer: