Jquery Fullcalendar：将日历高度调整为父div_Jquery_Fullcalendar

Jquery Fullcalendar：将日历高度调整为父div

jquery fullcalendar

Jquery Fullcalendar：将日历高度调整为父div,jquery,fullcalendar,Jquery,Fullcalendar,我正在尝试创建一个日历，将其大小调整为父div，但没有成功。它的工作宽度，但不是高度我没有修改Fullcalendar库的任何属性。我不希望有固定的高度，因为我希望将div/calendar调整为用户屏幕大小 HTML: <body> <div class="div-container"> <div id='calendar'></div> </div> </body> Fullcalendar有一个windowRes

我正在尝试创建一个日历，将其大小调整为父div，但没有成功。它的工作宽度，但不是高度

我没有修改Fullcalendar库的任何属性。我不希望有固定的高度，因为我希望将div/calendar调整为用户屏幕大小

HTML:

<body>
<div class="div-container">
<div id='calendar'></div>
</div>
</body>

Fullcalendar有一个windowResize回调，根据其文档，该回调是：

在日历的维度因以下原因更改后触发：正在调整浏览器窗口的大小

考虑到这一点，并且它有一个height属性，如果您得到要查找的div的高度，您应该能够执行以下操作：

function get_height() {
      return $(window).height();
}

$('#calendar').fullcalendar({
    height: get_height(),
    windowResize:  function(view) {
        $('#calendar').fullCalendar('option', 'height', get_calendar_height());
    },
    [...]

请确保您使用的选择器（在本例中为$（window））实际有一个高度，否则您的日历将没有任何高度。

Fullcalendar有一个windowResize回调，根据它们的文档：

在日历的维度因以下原因更改后触发：正在调整浏览器窗口的大小

考虑到这一点，并且它有一个height属性，如果您得到要查找的div的高度，您应该能够执行以下操作：

function get_height() {
      return $(window).height();
}

$('#calendar').fullcalendar({
    height: get_height(),
    windowResize:  function(view) {
        $('#calendar').fullCalendar('option', 'height', get_calendar_height());
    },
    [...]

确保您使用的选择器（在本例中为$（window））实际具有高度，否则您的日历将没有任何高度。

FullCalendar的构建方式（使用绝对定位的动态元素），您无法更改高度。看到这个就要“缩小”它。你可以通过调整宽度来调整它。我已经检查了那篇文章，没有任何选项对我有效：（.我只想调整整个div的大小，以便在页面中放置其他项目，它的宽度为100%，高度为100%。当我放置#日历{宽度：50%}它可以正常工作，但不能与HeightReach一起工作。您不能更改高度。FullCalendar是根据宽度动态渲染的。您唯一可以做的事情（可能很难看）是设置

溢出：滚动到容器。FullCalendar的构建方式（使用绝对定位的动态元素），你只是不能改变高度。看到这个就要“缩小”它。你可以用宽度来调整它。我已经检查了那篇文章，没有任何选项对我有效：（.我只想调整整个div的大小，以便在页面中放置其他项目，它的宽度为100%，高度为100%。当我放置#日历{宽度：50%}它工作正常，但与高度无关。再次，您无法更改高度。FullCalendar根据宽度动态呈现。您唯一可以做的事情（可能很难看）是设置溢出：滚动到容器。