爲每個鏈接的日曆設置單獨的背景顏色

Question

有沒有辦法爲具有特定於不同Google日曆的事件的日子設置背景顏色？ I.e .:我希望所有與日曆1中的事件有關的日子都有藍色背景，並且所有日曆都與日曆2中的事件有綠色背景。我知道如何一起改變所有事件的背景顏色，但不知道如何通過Google日曆將它們分開。我的當前設置與qTip2和Fullcalendar：

jQuery(document).ready(function(c){ 
(function() { 
var date = new Date(); 
var d = date.getDate(); 
var m = date.getMonth(); 
var y = date.getFullYear(); 

var tooltip = $('<div/>').qtip({ 
    id: 'fullcalendar', 
    prerender: true, 
    content: { 
     text: ' ', 
     title: ' ', 
     button: true 
    }, 
    events: { 
     render: function(event, api) { 
      var elem = api.elements.bgiframe; 
     } 
    }, 
    position: { 
     my: 'bottom center', 
     at: 'top center', 
     target: 'event', 
     viewport: $(window), 
     adjust: { 
      mouse: false, 
      scroll: true, 
      method: 'shift', 
      resize: true 
     } 
    }, 
    show: { 
     modal: { 
      on: false, 
      blur: true, 
      stealfocus: false 
      } 
     }, 
    hide: false, 
    style: { 
     classes: 'qtip-bootstrap qtip-shadow qtip-contact', 
     border: { 
      radius: 2 
     } 
    } 
}).qtip('api'); 

$('#fullcalendar').fullCalendar({ 

    eventSources: ["https://www.google.com/calendar/feeds/emailaddress1%40gmail.com/public/basic", 
     "http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic"], 

    header: { 
     left: 'title', 
     center: '', 
     right: 'today prev,next' 
    }, 

    selectable: true, 
    eventClick: function(data, event, view) { 
     var title = '<h5 style="margin:0;padding:0;">'+data.title+'</h5>'; 
     var content = '<p style="margin:0;padding:2px;"><b>Start:</b> '+data.start+'<br />' + 
      (data.end && '<p style="margin:0;padding:2px;"><b>End:</b> '+data.end+'</p>' || ''); 

     tooltip.set({ 
      'content.title': title, 
      'content.text': content 
     }) 
     .reposition(event).show(event); 
    }, 
    dayClick: function() { tooltip.hide() }, 

    eventResizeStart: true, 
    eventDragStart: false, 
    viewDisplay: function() { tooltip.hide() } 

}); 
}()); 

Answer 1

解決了它。

的Javascript：

eventSources: [{ 
    url:"https://www.google.com/calendar/feeds/email_address%40gmail.com/public/basic", 
    className: 'organizationevents' 
    }, 
    { 
    url:"http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic", 
    className: 'holidaysevents' 
    }] 

CSS：

/* Colors for events */ 
.organizationevents {background:#15BAD3;color:#fff;} 
.holidaysevents {background:#9D25F8;color:#fff;} 

Answer 2

從我的經驗，我沒有使用谷歌飼料，但我認爲你可以之前獲得的事件，給服務器端aplication，用這種飼料分成diferent飼料，然後：

var mygooglefeeds = { 
        googlefeedcolorblack: {    
         url:urltogooglefeedserverside, 
         type: 'POST',        
         data:{'googlefeedflag':'black'}, //you don´t actually need this but, you could wrap this multifeed array in a function and use this flag to get the different feed using the same function, your choice, just ignore this line. 
         cache: false,    
         color: '#000000', // Its here that you manage the color for this specific events 
         textColor: 'white'//and text color        
             }, 
        googlefeedcoloryellow: {    
        url:urltogooglefeedserverside, 
        type: 'POST',        
        data:{'googlefeedflag':'yellow'}, //you don´t actually need this but, you could wrap this multifeed array in a function and use this flag to get the different feed using the same function, your choice, just ignore this line. 
        cache: false,    
        color: 'yellow', // Its here that you manage the color for this specific events 
        textColor: 'white'//and text color        
            } 

} 

然後使用

... 
eventSources: [mygooglefeeds.mygooglefeedsblack,mygooglefeeds.mygooglefeedsyellow], 
... 

你會得到每類事件的diferent顏色。