Splitter sliding vertically from the bottom of the Window...

2 posts, 0 answers
  1. mark baer
    mark baer avatar
    142 posts
    Member since:
    Sep 2009

    Posted 13 Apr 2011 Link to this post

    I am trying to use the Splitter/Sliding Panel as a "Message Center" for errors in my master page.  I would like it at the BOTTOM of my Window.  Currently it shows up at the Bottom of My HTML...Can I get it so that it is ALWAYS at the Bottom of the Browser Window?  Here is my currently markup:

    Thanks, much appreciated.


    <telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Vertical" Skin="WebBlue" Width="100%" ><br>            <telerik:RadPane ID="RadPane1" runat="server"><br>                <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" SlideDirection="Top"><br>                    <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Message Center" Height="100" Scrolling="Y" BackColor="Red"><br>                        <asp:Label ID="lblErrorMessage" CssClass="textFields" runat="server" Text="Label"></asp:Label><br>                    </telerik:RadSlidingPane><br>                </telerik:RadSlidingZone><br>            </telerik:RadPane><br>        </telerik:RadSplitter>

    See attached image for current placement.
  2. Svetlina Anati
    Svetlina Anati avatar
    2795 posts

    Posted 14 Apr 2011 Link to this post

    Hello mark,

    The RadSplitter control is a layout control and it cannot be used only with one pane with sliding pane and as a popup - for this scenario you should use another control, e.g the panelbar in a similar configuration to the one shown below (changing orientation):


    You can, however, configure the splitter to be 100%, change orientation, put the page content in another RadPane and set border to be hidden - in this case you will get a whole layout, similar to your requirement, not only a popup.

    For your convenience I prepared sample configuration:

    <%@ Page Title="Home Page" Language="C#" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title>Untitled Page</title>
        <style type="text/css">
            html, body, form
                height: 100%;
                margin: 0;
                padding: 0;
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager2" runat="server">
        <telerik:RadSplitter ID="RadSplitter1" runat="server" Skin="WebBlue" Orientation="Horizontal"
            Width="100%" Height="100%" BorderSize="0">
            <telerik:RadPane ID="RadPane2" runat="server">
                PAGE CONTENT GOES HERE
            <telerik:RadPane ID="RadPane1" runat="server" Height="22">
                <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" SlideDirection="Top">
                    <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Message Center"
                        Height="100" Scrolling="Y" BackColor="Red">
                        <asp:Label ID="lblErrorMessage" CssClass="textFields" runat="server" Text="Label"></asp:Label><br>

    I hope that my explanations and suggestions are helpful, let me know if you have additional questions.

    All the best,
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. DevCraft R3 2016 release webinar banner
Back to Top