DayPilotCalendar not rendering hours correctly in HeightSpec=BusinessHoursNoScroll if toggled hidden/visible

Forgot to specify in my sample HeightSpec="BusinessHoursNoScroll", here's source code again (complete):

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<script type="text/javascript">

function toggle() {
$("#div1").toggle();
}
</script>

<div class="note"><b>Note:</b> Read more about controlling the event calendar <a href="http://doc.daypilot.org/calendar/height/">height</a>.</div>

<div>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem Value="scroll">Show busines hours, with scrollbar</asp:ListItem>
<asp:ListItem Value="hide">Show business hours, without scrollbar</asp:ListItem>
<asp:ListItem Value="show">Show full hours</asp:ListItem>
</asp:DropDownList><br />
<br />

<input type="button" id="button1" onclick="toggle();" value="toggle" />
<div id="div1" style="display: block;">
<daypilot:daypilotcalendar id="ctlAppointmentsCalendar" runat="server"
DataStartField="Start"
dataendfield="End"
datatextfield="Name"
datavaluefield="Id"
Days="1"

BusinessBeginsHour="5"
BusinessEndsHour="19"
HeightSpec="BusinessHoursNoScroll"

></daypilot:daypilotcalendar>
</div>
</div>
</asp:Content>

The browsers don't allow setting the scrollbar position on elements that are hidden.

The workaround is to call dp.enableScrolling() on the client side after the control becomes visible (where "dp" is the value of ClientObjectName property).

Just note that this is internal API that will be hidden in one of the future releases. There is a workaround implemented in the Pro version that detects when the control becomes visible and fixes the scrollbar position. It will be ported to the Lite version as soon as the internal .enableScrolling() gets hidden.