I was wondering if there is anyway to position the open/close image of the radsplitbar near the top of the bar instead of in the middle?
also it it possible to have more then one open/close button on the bar (ex. top, middle, bottom).
Thanks,
Andrew Day
also it it possible to have more then one open/close button on the bar (ex. top, middle, bottom).
Thanks,
Andrew Day
2 Answers, 1 is accepted
0
Accepted
Hi,
You could change the position of the left/right arrows by using CSS and applying vertical align to the cell containing the arrows:
As for your second question: also it it possible to have more then one open/close button on the bar (ex. top, middle, bottom). - I have never been asked such a question. Most probably it is possible, but it requires to change the HTML rendering and to add two more containers wrapping the arrows. This could be layout breaking and could seriously mess the CSS rules, so I would not recommend it. Also it is a custom solution and it is out of the scope of our support, so it is a developers decision and repsonibility to apply it and maintain it in order the control to work properly.
Regards,
Bozhidar
Telerik
You could change the position of the left/right arrows by using CSS and applying vertical align to the cell containing the arrows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
<
style
type
=
"text/css"
>
.RadSplitter td.rspResizeBar {
vertical-align: top; /* position the left/right arrow on top */
padding: 30px 0 0; /* defines padding of top 30px to move the arrows 30px down - could be changed to meet requierments */
}
</
style
>
</
head
>
<
body
style
=
"background: #fff;"
>
<
form
id
=
"form1"
runat
=
"server"
>
<
asp:ScriptManager
ID
=
"sm1"
runat
=
"server"
/>
<
telerik:RadSplitter
ID
=
"RadSplitter1"
runat
=
"server"
EnableEmbeddedBaseStylesheet
=
"true"
EnableEmbeddedSkins
=
"true"
Skin
=
"Default"
Height
=
"300"
>
<
telerik:RadPane
ID
=
"RadPane1"
runat
=
"server"
Width
=
"40px"
>
<
telerik:RadSlidingZone
ID
=
"RadSlidingZone1"
runat
=
"server"
>
<
telerik:RadSlidingPane
ID
=
"RadSlidingPane1"
runat
=
"server"
Title
=
"Pane1"
>
hello world
</
telerik:RadSlidingPane
>
</
telerik:RadSlidingZone
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
ID
=
"RadSplitBar1"
runat
=
"server"
CollapseMode
=
"Both"
>
</
telerik:RadSplitBar
>
<
telerik:RadPane
ID
=
"RadPane2"
runat
=
"server"
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
ID
=
"RadSplitBar2"
runat
=
"server"
CollapseMode
=
"Both"
>
</
telerik:RadSplitBar
>
<
telerik:RadPane
ID
=
"RadPane3"
runat
=
"server"
Width
=
"22px"
>
<
telerik:RadSlidingZone
ID
=
"RadSlidingZone3"
runat
=
"server"
SlideDirection
=
"Left"
ClickToOpen
=
"true"
>
<
telerik:RadSlidingPane
ID
=
"RadSlidingPane3"
runat
=
"server"
Title
=
"Pane2"
>
</
telerik:RadSlidingPane
>
</
telerik:RadSlidingZone
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
<
br
/>
<
telerik:RadSplitter
ID
=
"RadSplitter2"
runat
=
"server"
Orientation
=
"Horizontal"
EnableEmbeddedBaseStylesheet
=
"true"
EnableEmbeddedSkins
=
"true"
Skin
=
"Default"
>
<
telerik:RadPane
ID
=
"RadPane4"
runat
=
"server"
Height
=
"40px"
>
<
telerik:RadSlidingZone
ID
=
"RadSlidingZone2"
runat
=
"server"
>
<
telerik:RadSlidingPane
ID
=
"RadSlidingPane2"
runat
=
"server"
Title
=
"Pane1"
>
</
telerik:RadSlidingPane
>
</
telerik:RadSlidingZone
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
ID
=
"RadSplitBar3"
runat
=
"server"
CollapseMode
=
"Both"
>
</
telerik:RadSplitBar
>
<
telerik:RadPane
ID
=
"RadPane5"
runat
=
"server"
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
ID
=
"RadSplitBar4"
runat
=
"server"
CollapseMode
=
"Both"
EnableEmbeddedBaseStylesheet
=
"false"
EnableEmbeddedSkins
=
"false"
>
</
telerik:RadSplitBar
>
<
telerik:RadPane
ID
=
"RadPane6"
runat
=
"server"
Height
=
"22px"
>
<
telerik:RadSlidingZone
ID
=
"RadSlidingZone4"
runat
=
"server"
SlideDirection
=
"top"
ClickToOpen
=
"true"
>
<
telerik:RadSlidingPane
ID
=
"RadSlidingPane4"
runat
=
"server"
Title
=
"Pane2"
>
</
telerik:RadSlidingPane
>
</
telerik:RadSlidingZone
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
</
form
>
</
body
>
</
html
>
As for your second question: also it it possible to have more then one open/close button on the bar (ex. top, middle, bottom). - I have never been asked such a question. Most probably it is possible, but it requires to change the HTML rendering and to add two more containers wrapping the arrows. This could be layout breaking and could seriously mess the CSS rules, so I would not recommend it. Also it is a custom solution and it is out of the scope of our support, so it is a developers decision and repsonibility to apply it and maintain it in order the control to work properly.
Regards,
Bozhidar
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Andrew
Top achievements
Rank 1
Veteran
Iron
answered on 10 Jul 2013, 12:25 PM
great thanks