Как редактировать ширину события в FullCalendar?

Question

Это кажется невероятно простым, но я потратил полдня, стуча головой о стену, пытаясь понять, почему мои события в полном календаре отображаются только на 77px, когда ширина ячейки (просмотр месяца), кажется, либо 90pxили выше.Я попытался изменить правило cc-события fc-event, но похоже, что javascript записывает некоторые встроенные стили в календарь, переписывая эти стили.

Кажется, я не могу узнать, где эти стили пишутся!

Может ли кто-нибудь, кто настроил fullcalendar, дать некоторое представление?Он работает как страница в блоге WordPress, не уверен, что это как-то связано с этим, так как я заметил, что одна из кнопок заблокирована в неудобном положении.

Answer 1

вы можете установить ширину события с помощью eventAfterRender

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

Answer 2

Я использовал! Важно переопределить встроенный стиль, и он отлично работал

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

Answer 3

Я получил результат, используя этот код, и надеюсь, что с вами тоже все будет хорошо.

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

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

TwentyTen добавляет ячейки таблицы дополнения (см. Style.css):

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

Следующее должно «исправить» это для fullCalendar:

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

Answer 6

Некоторые стили WordPress темы не подходят для полноценного календаря.Я использую Wordpress 3.0, используя стиль Twenty Ten.Вместо того, чтобы вставлять его в div содержимого, я вставлял его в родительский элемент, контейнер div, а затем стили исправляли сами.