DayPilot Scheduler can highlight the current cursor position by showing a crosshair. It helps with orientation in large grids.

The crosshair mode is determined by Crosshair property:

  • Header (default) - decent header highlighting
  • Full - full column and row indicator
  • Disabled - no crosshair

Full Crosshair (Crosshair="Full")

dps-crosshair2-full-657x349.png

This mode shows a full crosshair, highlighting the current row and column.

Header Crosshair (Crosshair="Header")

dps-crosshair2-header-657x349.png

This is a more decent mode, highlighting only the headers.

Crosshair Properties

The crosshair appearance can be customized using the following properties:

  • CrosshairColor
  • CrosshairOpacity

Examples

Default Values

  • (CrosshairColor="Gray")
  • (CrosshairOpacity="20")
  • (Crosshair="Header")

scheduler-crosshair-default241x121.png

Custom Values (Header Only)

  • CrosshairColor="Orange"
  • CrosshairOpacity="50"
  • (Crosshair="Header")

scheduler-crosshair-orange241x121.png

Custom Values (Full)

  • CrosshairColor="Orange"
  • CrosshairOpacity="50"
  • Crosshair="Full"

scheduler-crosshair-orange-full241x121.png

ASP.NET WebForms

<DayPilot:DayPilotScheduler runat="server" id="DayPilotScheduler1"
  ...
  Crosshair = "Full"
/>

ASP.NET MVC

@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig {
  BackendUrl = ResolveUrl("~/Scheduler/Backend"),
  ...
  Crosshair = CrosshairType.Full
})

JavaScript

<div id="dp"></div>
<script type="text/javascript">
  var dp = new DayPilot.Scheduler("dp");
  dp.crosshairType = "Full";
  // ...
  dp.init();
</script>