IE6,7 - secondary menu UI issue

2 posts, 0 answers
  1. Antonin Jelinek
    Antonin Jelinek avatar
    5 posts
    Member since:
    Jul 2005

    Posted 07 Sep 2009 Link to this post

    Hello,

    I have 2 instances of RAD Menu on a page: one main navigation line (with items sliding down on mouse over) and one submenu on left hand side of a page. However, these two controls are independent, only sharing same custom skin.

    In IE6 and 7, items sliding from main menu are rendered under submenu (in terms of z-index), while IE 8 and FireFox is displaying this properly (i.e. main menu items are shown in front of submenu).

    My guess is this is due to default z-index (7000) settings that RadMenu emits to it's enclosing div. However, even after spending several hours on setting various combination of z-index, I was not able to make it work properly under IE6 and 7.

    Anyone tried to put two independent instances of RAD Menu on page and had similar issue in IE6 and 7?

    Thanks,

    Antonin

  2.
  3. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 07 Sep 2009 Link to this post

    Hi Antonin,

    Please set higher z-index to the first menu, i.e.

    <form id="form1" runat="server"> 
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 
        </telerik:RadScriptManager> 
        <telerik:RadMenu ID="RadMenu1" runat="server" Style="z-index: 8000"> 
            <Items> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1"> 
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem2"> 
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 4"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 5"> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenuItem> 
            </Items> 
        </telerik:RadMenu> 
        <br /> 
        <br /> 
        <telerik:RadMenu ID="RadMenu2" runat="server"> 
            <Items> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1"> 
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem2"> 
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 4"> 
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 5"> 
                        </telerik:RadMenuItem> 
                    </Items> 
                </telerik:RadMenuItem> 
            </Items> 
        </telerik:RadMenu> 
        </form> 


    Kind regards,
    Paul
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Back to Top