Cách chỉnh sửa chiều rộng của sự kiện trong FullCalendar?

Question

Điều này có vẻ vô cùng dễ dàng, nhưng tôi đã dành nửa ngày bashing đầu vào tường cố gắng tìm ra lý do tại sao sự kiện fullcalendar của tôi chỉ hiển thị ở 77px, khi chiều rộng của ô (xem tháng) có vẻ là 90px hoặc cao hơn. Tôi đã thử sửa đổi quy tắc cc-sự kiện fc, nhưng có vẻ như javascript đang viết một số kiểu nội tuyến vào lịch, ghi đè các kiểu này.

Tôi dường như không thể tìm ra nơi các kiểu này được viết!

Có ai có thể tùy chỉnh toàn bộ nội dung cung cấp thông tin chi tiết không? Nó đang chạy như một trang trên một blog wordpress, không chắc chắn nếu điều này có bất cứ điều gì để làm với nó, như tôi nhận thấy rằng một trong các nút được lopped off ở một vị trí khó xử.

Answer 1

Một số kiểu chủ đề wordpress không chơi đẹp với fullcalendar. Tôi đang sử dụng Wordpress 3.0, sử dụng phong cách Twenty Ten. Thay vì chèn nó vào bên trong div nội dung, tôi đã chèn nó vào trong phần tử cha của nó, div vùng chứa, và sau đó các kiểu tự sửa lỗi.

Answer 2

bạn có thể thiết lập chiều rộng sự kiện với eventAfterRender

$('#calendar').fullCalendar({ 
    eventAfterRender: function(event, element, view) { 
         $(element).css('width','50px'); 
        } 
}); 

Answer 3

TwentyTen thêm ô trong bảng đệm (xem style.css):

#content tr td { 
    border-top: 1px solid #e7e7e7; 
    padding: 6px 24px; 
} 

Sau đây nên 'sửa chữa' này cho fullCalendar:

#content .fc tr td{ 
    padding:0px; 
} 

Answer 4

eventRender: function (event, element, view) { 
    if (event.eventType == "Task") { //own property 
     var one_day = 1000 * 60 * 60 * 24; 
     var _Diff = Math.ceil((event.start.getTime() - view.visStart.getTime())/(one_day)); 
     var dayClass = ".fc-day" + _Diff; 

     if (event.days == 1) { //own property 
      jQuery(dayClass).addClass("one-day-event"); //set width to 90px (cca 2 cells) 
     } else { 
      jQuery(dayClass).removeClass("one-day-event"); 

     } 
     view.setWidth(jQuery(dayClass).css("width") * event.days); 
    } 
}, 

Answer 5

Tôi đã sử dụng ! Quan trọng để ghi đè lên phong cách nội tuyến và nó làm việc tốt

.fc-event{ width: 98px !important;}

Answer 6

tôi có kết quả bằng cách sử dụng mã số và niềm hy vọng này làm việc tốt với bạn quá.

$('#calendar').fullCalendar({ 
    eventAfterRender: function(event, element, view) 
    { 
     $(element).css('width','50'); 
    } 
});