Using Telerik Skin for own Controls

[Marcel Rossi]

Hello Telerik!

I am trying to use some attributes like 'fore- and background-color', from the current selected Skin, for my own Controls.

For Example I implemented a variation of your BreadCrump-Example.
Your Example has an orange colored DIV in front of the BreadCrump.

It's easy to change the color to, let us say green, by editing the style for that DIV in my own CSS.

Now I will change the color of that DIV by changing the style with the SkinChooser.

For Example, if I change the Skin to 'Vista' all the Grids will have a nice blue colored Header.
Only my BreadCrum is still in green (look's very ugly).

In best case I will read the current color of the Grid-Header and use it on my BreadCrump-DIV, without having other "external" CSS-Files or multiple definitions in my CSS for it.

Is this possible?
If yes, how can it be done?

Many Thanks for your help!

Regards
Marcel

[Dimo]

Hi Marcel,

Generally, there are two ways to achieve your goal:

1. Prepare a separate CSS file for each RadControls skin that you are using and include some custom styles in each file. For example the DIV background will be blue when using the Vista skin and green when using the Hay skin, etc. Depending on the value of the RadSkinManager's Skin property, you will have to register one of these CSS files programmatically with a HtmlLink control.


2. Theoretically, you can read the currently applied styles for a given DOM element with  the following Javascript method from our static client library:

$telerik.getCurrentStyle(element, styleAttribute, defaultValue)

After reading the style property value, you can apply it to some other element on the page. However, this is somewhat cumbersome and resource-intensive operation and repeating it a large number of times will decrease the page client performance.

I suggest you to use option (1).

Greetings,
Dimo
the Telerik team

[Marcel Rossi]

Hi Dimo,

Thanks a lot for your Answer!

I think I will go the first Option.

Greetings,
Marcel