Version

Style Multi Day Event Banner

You can customize the look of the multiday event arrows when displaying events spanning multiple days. The WebMonthView™ and WebDayView™ WebSchedule™ controls expose the MultiDayEventArrowLeftStyle and MultiDayEventArrowRightStyle properties to allow you to set custom styles.

To change the style of the banner itself, use the AllDayEventStyle property.

The following code shows you how to set custom multiday event arrow images and change the banner’s background color for WebDayView.

In HTML:

<style type="text/css">
    .leftArrow
    {
        background-image: url("Pictures/MovePreviousArrow.png");
        width: 20px;
        height: 20px;
    }
    .rightArrow
    {
        background-image: url("Pictures/MoveNextArrow.png");
        width: 20px;
        height: 20px;
    }
    .banner
    {
        background-color: #4867D6;
        background-image: none;
    }
</style>
…
<igsch:WebDayView ID="WebDayView1" runat="server" WebScheduleInfoID="WebScheduleInfo1">
    <MultiDayEventArrowLeftStyle CssClass="leftArrow">
    </MultiDayEventArrowLeftStyle>
    <MultiDayEventArrowRightStyle CssClass="rightArrow">
    </MultiDayEventArrowRightStyle>
    <AllDayEventStyle CssClass="banner">
    </AllDayEventStyle>
</igsch:WebDayView>
WebScheduleGenericDataProvider Style Multi Day Event Banner 01.png