Tony Polad
Top achievements
Rank 1
Tony Polad
asked on 03 Sep 2008, 02:06 PM
Hi,
1. How do I modify the expand/collapse icon in the dock ?
2. How do I move the position of the expand/collapse icon to left side.
Here is what I wanna do.
1. Change the expand/collapse icon with the triangle icon.
2. Move the position of the expand/collapse icon to the left (just before the title of the dock)
Any help would be appriciated.
Thanks.
1. How do I modify the expand/collapse icon in the dock ?
2. How do I move the position of the expand/collapse icon to left side.
Here is what I wanna do.
1. Change the expand/collapse icon with the triangle icon.
2. Move the position of the expand/collapse icon to the left (just before the title of the dock)
Any help would be appriciated.
Thanks.
5 Answers, 1 is accepted
0
-DJ-
Top achievements
Rank 1
answered on 03 Sep 2008, 03:26 PM
Hi Susanto.
1. You just have to edit the
.RadDock_MySkin .rdCollapse
and
.RadDock_MySkin .rdExpand
classes. There you can set a new image of your choice.
Example:
.RadDock_MySkin .rdCollapse
{
background:url(Dock/minimize.png) no-repeat;
}
2. To align it to the left side I'm guessing you will have to set a right margin. How big depends on the width of your dock.
Something like this should work:
.RadDock_MySkin .rdCollapse
{
background:url(Dock/minimize.png) no-repeat;
margin-right: 250px
}
Note that you can also set hover images for both the expand and collapse images by adding these classes to your skin css file:
.RadDock_MySkin .rdCollapse:hover
.RadDock_MySkin .rdExpand:hover
Regards,
-DJ-
1. You just have to edit the
.RadDock_MySkin .rdCollapse
and
.RadDock_MySkin .rdExpand
classes. There you can set a new image of your choice.
Example:
.RadDock_MySkin .rdCollapse
{
background:url(Dock/minimize.png) no-repeat;
}
2. To align it to the left side I'm guessing you will have to set a right margin. How big depends on the width of your dock.
Something like this should work:
.RadDock_MySkin .rdCollapse
{
background:url(Dock/minimize.png) no-repeat;
margin-right: 250px
}
Note that you can also set hover images for both the expand and collapse images by adding these classes to your skin css file:
.RadDock_MySkin .rdCollapse:hover
.RadDock_MySkin .rdExpand:hover
Regards,
-DJ-
0
Tony Polad
Top achievements
Rank 1
answered on 04 Sep 2008, 12:47 AM
Hi,
Thanks for the answer.
The icon is works.
But
The alignment does not work as expected.
I have a dynamic size of Dock. The Dock can be resize at any time.
How you you set it from css without set the fixed value. I did try to put percentage, but it does not work.
Do you have any other suggestion ?
Thanks.
Thanks for the answer.
The icon is works.
But
The alignment does not work as expected.
I have a dynamic size of Dock. The Dock can be resize at any time.
How you you set it from css without set the fixed value. I did try to put percentage, but it does not work.
Do you have any other suggestion ?
Thanks.
0
-DJ-
Top achievements
Rank 1
answered on 04 Sep 2008, 02:17 PM
Hi again Susanto.
I won't be at my work computer until next Tuesday, so I'm afraid I won't be of much help to you.
If I remember correctly there is no Dir="rtl" property for the Dock, nor is there a simple align value for the buttons.
Using % doesn't sound like a bad idea, but you will probably have to add some javascript so the % get applied on the fly as the user resizes the dock.
That is if you get the % working in the first place.
Regards,
-DJ-
I won't be at my work computer until next Tuesday, so I'm afraid I won't be of much help to you.
If I remember correctly there is no Dir="rtl" property for the Dock, nor is there a simple align value for the buttons.
Using % doesn't sound like a bad idea, but you will probably have to add some javascript so the % get applied on the fly as the user resizes the dock.
That is if you get the % working in the first place.
Regards,
-DJ-
0
Hi Susanto,
Unfortunately, the scenario with the left-aligned expand / collapse button cannot be achieved with the current rendering of RadDock neither with margins (as DJ has suggested), nor with any kind of positioning, because the buttons have a wrapping element that does not allow such manipulation.
I have tried several approaches, but none of these worked.
Have a great weekend,
Martin Ivanov
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Unfortunately, the scenario with the left-aligned expand / collapse button cannot be achieved with the current rendering of RadDock neither with margins (as DJ has suggested), nor with any kind of positioning, because the buttons have a wrapping element that does not allow such manipulation.
I have tried several approaches, but none of these worked.
Have a great weekend,
Martin Ivanov
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
harika dasari
Top achievements
Rank 1
answered on 05 Nov 2009, 12:51 PM
Hi,
I want to change the image of Expand/Collapse of raddock
i tried giving the same as mentioned
but not working
following is the code which i have added to my aspx page
<
style type="text/css">
.rdExpand
{
background:url(DockImage\DockImage\Images\red.urgent.icon.28x28.gif) no-repeat;
}
</style>
Need help on this asap
Thanks in Advance
Pushpa.