手风琴中的Fullcalendar

时间:2018-06-11 13:46:57

标签: javascript jquery fullcalendar

我正在尝试将Fullcalendar放入可折叠的手风琴中。出于某种原因,当我打开手风琴时,它只显示日历的顶部而不显示整个对象。有时我很遗憾吗?

jquery的

$(document).ready(function() {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
    //Load Full Calendar
    $('#calendar').fullCalendar({
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,basicWeek,basicDay'
      },

      editable: true,
      events: [
        {
          title: 'All Day Event',
          start: new Date(y, m, 1)
        },
      {
          title: 'Click for Google',
          start: new Date(y, m, 28),
          end: new Date(y, m, 29),
          url: 'http://google.com/'

        }
      ]
    });
//Accordion
   $(".btn").on( "click", function() {
        $("#toggleDemo").collapse('toggle');
    });

  });

HTML

  <div class="container">
          <div class="row">
           <div class="col-xs-10">
             <input type="button" class="btn btn-primary" data-toggle="collapse" data-target="#toggleDemo" value="Calendar">

<!-- Collapsible Element HTML -->
<div id="toggleDemo" class="collapse collapse">
  <h1>In Here</h1>
    <div id="calendar"></div>
  </div>
</div>
</div>
</div>

1 个答案:

答案 0 :(得分:0)

以下是工作演示:https://codepen.io/creativedev/pen/zaZjYN

它显示了带有手风琴的fullcalender。只有一个时刻js版本的问题。包含此版本文件

https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js

它会起作用!!