Available modes:

  • SideBySide
  • Cascade
  • Full

You can change the event arrangement mode using EventArrangement property.

SideBySide

event-arrangement-mode-side-by-side.png

Cascade

event-arrangement-mode-cascade.png

Full

event-arrangement-mode-full.png

ASP.NET WebForms

<DayPilot:DayPilotCalendar runat="server" ID="DayPilotCalendar1"
  EventArrangement="Cascade"
  ...
/>

ASP.NET MVC

MVC View

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig { 

  // ...
  EventArrangement = ArrangementType.Cascade,
  // ...
	
})

JavaScript

<div id="dp"></div>

<script type="text/javascript">
  var dp = new DayPilot.Calendar("dp");
  dp.eventArrangement = "Cascade";
  // ...
  dp.init();
</script>