This is a migrated thread and some comments may be shown as answers.

RadTollBar and RadMenu: z-index issues

6 Answers 181 Views
ToolBar
This is a migrated thread and some comments may be shown as answers.
Veenu
Top achievements
Rank 1
Veenu asked on 13 Nov 2009, 12:39 PM
Hi,

I've used the RadToolBar as a container to display RadMenus. RadToolBar is placed in a Master Page so that it is available with standard features on all pages. RadToolBar is fixed in its position using CSS expressions:

* html .ToolBar_Fixed 
        {
            position:relative !important;
            top:expression(eval(document.documentElement.scrollTop? document.documentElement.scrollTop : document.body.scrollTop) + "px");
            left:expression(eval(document.documentElement.scrollLeft? document.documentElement.scrollLeft : document.body.scrollLeft ) + "px");
        }   

Now, the issue is that when the content page is scrolled, ToolBar stays at its position but standard dropdown controls (as shown in attached image) are displayed over it, and not under it. This issue appears with IE6 only and is fine with IE7.
On the other hand, when other 3rd party controls (like charts) are to be shown, the RadMenus in the RadToolBar get hidden by the 3rd party controls and are not displayed (probably due to some z-index issue)  - This issue exists across browsers.

Please help, as this is needed by the client for go-live very soon.
Thanks.

6 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 19 Nov 2009, 08:36 AM
Hello Veenu,

You should add an iframe with the same size as the toolbar next to is in order to fix this overlay issue in IE6. I've attached a simple page to demonstrate how you can do this. Please download the attached file and give it a try.

Regarding the z-index question, please review this blog post for more information.

Greetings,
Yana
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.
0
Veenu
Top achievements
Rank 1
answered on 19 Nov 2009, 11:20 AM
Hi,

Did you forget to attach the sample file? I couldn't find it here with the reply.
Can you please provide it again for reference?

Thanks and Regards.
Veenu Munjal
0
Accepted
Yana
Telerik team
answered on 19 Nov 2009, 03:35 PM
Hello Veenu,

I'm sorry I missed to attach file. Here it is.

Greetings,
Yana
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.
0
Veenu
Top achievements
Rank 1
answered on 01 Dec 2009, 03:23 PM
Hi Yana,

It works! And it worked on the same issue identified on RadWindow as well!
Cheers! :)

Thanks a  lot for your support.
Best Regards,
Veenu Munjal
0
Veenu
Top achievements
Rank 1
answered on 05 Jan 2010, 02:27 PM

Hi Yana,

 

First of all, Wish you a very Happy New Year!

 

I am sorry to bother you with the same old issue, but it has reoccured in the context that two Telerik Controls (RadToolbar and RadMenu) are now struggling for a higher z-index.

Previously, my issue was that all controls (like Textboxes, Dropdowns) were being displayed over the RadToolBar which was fixed in position (not to be scrolled). And you gave me the fix so that RadToolbar is never overridden by any control.

It was great and even worked on similar issues related to RadWindow!

But now, in the header, I have a Culture RadMenu, which can list 10+ cultures, but the RadMenu goes behind the RadToolBar when it should appear over and above it. So a major feature comes to a new halt! :(

Can you please help again on the same?

Thanks and Regards,
Veenu Munjal

0
Accepted
Yana
Telerik team
answered on 06 Jan 2010, 02:38 PM
Hi Veenu,

Happy New Year!

You should set higher z-index to the menu in order to overlap the toolbar:

<telerik:RadMenu ID="RadMenu1" runat="server" style="z-index:  200001;">

Greetings,
Yana
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.
Tags
ToolBar
Asked by
Veenu
Top achievements
Rank 1
Answers by
Yana
Telerik team
Veenu
Top achievements
Rank 1
Share this question
or