Menu not overlaying over Splitter

7 posts, 0 answers
  1. Hoang
    Hoang avatar
    5 posts
    Member since:
    Apr 2009

    Posted 15 May 2009 Link to this post

    Hi, is there a property to make the menu popout over the Splitter?  I am trying to build out the layout of a site using a splitter,  when the menu pop-out, it will not overlay the splitter.  I am using IE8 to view it.

     

    <telerik:RadSplitter ID="RadSplitter1" runat="server"   
            ResizeWithBrowserWindow="true" FullScreenMode="true" Orientation="Horizontal">  
            <telerik:RadPane ID="RadPane1" runat="server">  
                <telerik:RadMenu ID="RadMenu1" runat="server" ClickToOpen="True" EnableOverlay="true">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="File">  
                            <Items> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                            </Items> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenu> 
            </telerik:RadPane> 
            <telerik:RadPane ID="BodyPane" runat="server" Width="100%" Height="100%" Scrolling="None">  
                <telerik:RadSplitter ID="NavigationPanelContentPanelSplitter" runat="server" Orientation="Vertical" 
                    ResizeMode="EndPane" VisibleDuringInit="true"   
                    SplitBarsSize="3">  
                    <telerik:RadPane ID="NavigationPanelDock" runat="server" Width="100" Height="100%" 
                        Scrolling="None" Collapsed="false" Locked="true">  
                        Left Pane 
                    </telerik:RadPane> 
                    <telerik:RadSplitBar ID="NavigationPanelDockSplitBar" runat="server" CollapseMode="None" 
                        Enabled="false" Visible="false" /> 
                    <telerik:RadPane ID="NavigationPanel" runat="server" Width="100" MinWidth="150" Height="100%" 
                        Scrolling="None" Collapsed="false" Locked="false">  
                        Right Pane  
                    </telerik:RadPane> 
                </telerik:RadSplitter> 
            </telerik:RadPane> 
        </telerik:RadSplitter> 
  2. Hoang
    Hoang avatar
    5 posts
    Member since:
    Apr 2009

    Posted 15 May 2009 Link to this post

    I just test this in IE7 and it seem to run fine.  But the problem still exists in IE8, any ideas?
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 16 May 2009 Link to this post

    Hi Hoang,

    Please find below your modified code snippet that works as expected.

    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <title></title>  
        <style type="text/css">  
            .menuPanes  
            {  
                overflow: visible !important;  
            }  
        </style> 
    </head> 
    <body> 
        <form runat="server" id="mainForm" method="post">  
        <telerik:RadScriptManager ID="ScriptManager" runat="server" /> 
        <telerik:RadSplitter ID="RadSplitter1" runat="server" ResizeWithBrowserWindow="true" 
            FullScreenMode="true" Orientation="Horizontal">  
            <telerik:RadPane ID="RadPane1" runat="server" CssClass="menuPanes">  
                <telerik:RadMenu ID="RadMenu1" runat="server" ClickToOpen="True" EnableOverlay="true">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="File">  
                            <Items> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                                <telerik:RadMenuItem runat="server" Text="New" /> 
                            </Items> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenu> 
            </telerik:RadPane> 
            <telerik:RadPane ID="BodyPane" runat="server" Width="100%" Height="100%" Scrolling="None">  
                <telerik:RadSplitter ID="NavigationPanelContentPanelSplitter" runat="server" Orientation="Vertical" 
                    ResizeMode="EndPane" VisibleDuringInit="true" SplitBarsSize="3">  
                    <telerik:RadPane ID="NavigationPanelDock" runat="server" Width="100" Height="100%" 
                        Scrolling="None" Collapsed="false" Locked="true">  
                        Left Pane  
                    </telerik:RadPane> 
                    <telerik:RadSplitBar ID="NavigationPanelDockSplitBar" runat="server" CollapseMode="None" 
                        Enabled="false" Visible="false" /> 
                    <telerik:RadPane ID="NavigationPanel" runat="server" Width="100" MinWidth="150" Height="100%" 
                        Scrolling="None" Collapsed="false" Locked="false">  
                        Right Pane  
                    </telerik:RadPane> 
                </telerik:RadSplitter> 
            </telerik:RadPane> 
        </telerik:RadSplitter> 
        </form> 
    </body> 
    </html> 


    Regards,
    Paul
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  5. Hoang
    Hoang avatar
    5 posts
    Member since:
    Apr 2009

    Posted 18 May 2009 Link to this post

    It works, thanks.
  6. ColinBowern
    ColinBowern avatar
    51 posts
    Member since:
    Aug 2012

    Posted 16 Jun 2009 Link to this post

    I am looking to do a similar thing.  I have used the above code but when the menu is too long it wraps and pushes the top pane down.  I tried using the MinWidth but RadMenu appears to ignore it.

    Any thoughts on how I can get the top pane to respect MinWidth?

    Thanks,
    Colin
  7. Nicolaï
    Nicolaï avatar
    160 posts
    Member since:
    Apr 2008

    Posted 22 Oct 2013 Link to this post

    Same problem, but the pane contains more than just the menu and needs scrolling...
    What to do?
  8. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 24 Oct 2013 Link to this post

    Hello Nicolaï,

    I would suggest that you open a separate support ticket where you can attach your sample page that we can inspect from our side. When writing the support ticket can you also provide more details on the specific issue that you are experiencing as well as provide some screenshots that will help us get a better idea of the specific case?  

    Regards,
    Kate
    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017