How to change the default Hover border color for specific tile

[Todd A]

How to change the default Hover border color for specific tile?

In this example, let's say we wanted the red tile to have a red border.

http://demos.telerik.com/aspnet-ajax/tilelist/examples/overview/defaultcs.aspx

Is there a simple way to do this with the control?

Setting the BorderColor property on the tile shows the border always with no hover effect.

Thanks,
Todd.

[Marin Bratanov]

Hello Todd,

The border on the selected tiles comes via CSS rules and a class, and you can override it like that:

div.RadTile.rtileSelected,
div.RadTile.rtileSelected.rtileHovered
{
    border-color: red;
}

which would affect all tiles on the page. You can then make this more specific in a number of ways, for example, by using the CssClass property of the tile, or a skin-specific selector.

Here is a concrete example:

div.RadTile.rtileSelected.redSelection,
div.RadTile.rtileSelected.rtileHovered.redSelection
{
    border-color: red;
}

<telerik:RadTextTile runat="server" ID="one" Text="lorem" EnableSelection="true" Selected="true"></telerik:RadTextTile>
<telerik:RadTextTile runat="server" ID="two" Text="ipsum" EnableSelection="true" Selected="true" CssClass="redSelection"></telerik:RadTextTile>

Regards,

Marin Bratanov
Telerik

 

 

[Todd A]

Great.  I will give it a try!