Как изменить цвет фона телерика радротатора выбранного пункта - PullRequest
Новая
       17

Как изменить цвет фона телерика радротатора выбранного пункта

0 голосов
/ 31 октября 2011

Я использую radrotator в своем приложении, как я могу изменить цвет границы или цвет выбранного элемента ротатора из кода asp.net c # позади, могу ли я рассчитывать на некоторую помощь в этом.

1 Ответ

2 голосов
/ 31 октября 2011

Вы можете изменить границу элемента управления RadRotator и его элементов с помощью дополнительных классов CSS:

  1. Внутренний класс CSS rrClipRegion может быть переопределен для установкиновый цвет для границы элемента управления ротатора: 

    .rrClipRegion
{
    border: 1px solid green !important;
}

  2. Вы можете установить цвет границы по умолчанию для элементов RadRotator с помощью CSS, а затем изменить его из кода позади, определивКласс CSS с новым цветом рамки, как показано ниже:

Разметка RadRotator: 

    <telerik:RadRotator ID="RadRotator1" runat="server" FrameDuration="3000" ScrollDirection="Left"
        Height="123px" ItemHeight="113px" Width="180px" ItemWidth="152px" Skin="Default"
        RotatorType="Buttons" OnItemClick="RadRotator1_ItemClick">
        <ItemTemplate>
            <div>
                <img src="....." alt="" />
            </div>
        </ItemTemplate>
    </telerik:RadRotator>

Стили, необходимые дляприменение границ: 

<style type="text/css">
    .rrItem
    {
        margin: 4px;
    }

    .rrItem img
    {
        border: 1px solid grey;
    }

    .cssSelectedItem img
    {
        border: 1px solid red;

    }
</style>

Изменение цвета границы элемента из кода: 

protected void RadRotator1_ItemClick(object sender, RadRotatorEventArgs e)
{
    RadRotatorItem item = (RadRotatorItem)e.Item;
    item.CssClass = "cssSelectedItem";

    RadRotator1.InitialItemIndex = e.Item.Index;
}

Обратите внимание, что я установил InitialItemIndex свойство элемента управления ротатора для сохранения текущего элемента посредством обратной передачи.Кроме того, пример предназначен для изображений размером 150x113, поэтому, если используются разные размеры, вам следует изменить свойства Ширина , Высота , ItemWidth , ItemHeight соответственно.

...