Version

Styling Active and Inactive Resources

Multi Resource View gives you multiple buttons for multiple resources allowing you to switch between different resources available. You can change the styles for these buttons as well as the styles for their appointments.

You can use the following style properties to style resources and activities for Multi Resource View:

The following code shows you how to set the active resource button and its appointments to a green color and inactive buttons and appointments to a silver color.

In HTML:

<style type="text/css">
    /* Active style * /
    .activeResource
    {
        background-color: Green;
        /* Most default styles use images,
         * remove image to see your custom style * /
        background-image: none;
    }
    /* Inactive style * /
    .inactiveResource
    {
        background-color: Silver;
        background-image: none;
    }
    /* Inactive hover style * /
    .inactiveResource:hover
    {
        background-color: Green;
        background-image: none;
    }
</style>
…
<igsch:WebMonthView ID="WebMonthView1" runat='server' WebScheduleInfoID="WebScheduleInfo1">
    <%--Set active button color--%>
    <ResourceButtonActiveStyle CssClass="activeResource">
    </ResourceButtonActiveStyle>
    <%-- Set inactive button and appointment color --%>
    <FadedAppointmentStyle CssClass="inactiveResource">
    </FadedAppointmentStyle>
    <%-- Set active appointment color --%>
    <AppointmentStyle CssClass="activeResource">
    </AppointmentStyle>
</igsch:WebMonthView>
WebSchedule Styling Active and Inactive Resources 01.png