jQuery UI overlapping/masking MvcSiteMap menu - asp.net-mvc-3

Please see the images below. jQuery UI controls are overlapping/masking MvcSitemap drop down. I believe this is a quick fix (changing a css property of UI theme or so) but I'm having hard time finding how to override this behavior of UI controls. Hope someone will help resolve this issue.
UI Buttons overlapping the menu
Tab control overlapping the menu
Thanks in advance.

Add a high z-index css style to the MvcSitemap dropdowns css. Something like z-index: 1000; would be a reasonable start.
The jQUery UI controls are not intentionally going over anything, instead the menu is being rendered underneath the things below it. This is because its html comes before the other widgets in the document layout.

Related

How to hidden the border of button in sweetalert2

The border of button appears automatically. How to close it so that it will never appear? Thanks.
The button in sweetalert2
I guess you are talking about the outline of a focused button:
It's possible to remove that outline from buttons, but PLEASE DO NOT DO THAT.
There's a reason for that ugly outline!
You're killing the keyboard accessibility of your app. People with vision disabilities, as well as keyboard-ninjas, will hate you for that.
SweetAlert2 authors were working hard to make that plugin accessible to all users, by removing buttons outline you simply ruin their effort.

What Kendo UI controls are not responsive (UX)?

I heard that not all controls from Kendo UI are responsive (by design). I tried searching through documentation and I am unable to find any clue. I would like to know if there is really a case as such.
Especially, I would like to know if anyone had any "responsive" problems with "Kendo UI Window"

Kendo-UI Grid in a Tab

I am looking into using Kendo UI Web on a new HTML5 Web app and the wireframes call for grids inside tabs. I looked everywhere on Telerik's site, and the web, but I don't see any examples of this being done. Is that not possible? Or is there a better approach, like simply using the Tab control above the area where the Grid control would appear, giving it the appearance that the Grid is part of the Tab?
There should be nothing stopping you from using a Kendo UI Grid within a Kendo UI TabStrip. Check out the demo for the TabStrip and the demo for the Grid. Hopefully that gets you on your way.
The details template demo has a tabstrip within a grid and one of the tab is another grid, the second tab having a template.
http://demos.telerik.com/kendo-ui/grid/detailtemplate

jQuery ui dialog overlay and ajax injected html

I have a problem with a site (unfortunately I can't provide a link because it's on a staging environment).
I have a jqueryui dialog that opens when page loads, if you scroll down the overlay covers all of it.
Then some part of the page is updated by ajax calls and the height of the page increase and that's the issue, the overlay don't covers all the page any more and the bottom content is accessible.
I can see that the overlay adapts to certain changes, like resize of the page.. is there a way to update it when scrolling down for example? that could solve my issue
I'm sorry I can't provide a link that shows the issue..
Regards,
Gianpiero
In a similar situation I found a successful workaround by triggering a window resize event after each asynchronous DOM change:
$(window).resize();

How can I properly display CKEditor 4.0 toolbar drop-down menus and other popups in a window?

I have a kendo UI window (but I think jquery UI window/dialog will result in same issue). I have a CKEditor 4.0 in the window. Drop-down menus such as font, style, etc. and context menus initially display when clicked. However, after clicking in the text area, the drop down will fail to display when clicked on again.
I only see this issue with CKEditor 4.0. Version 3.6 seems fine. Does anyone know of a workaround to this issue in 4.0? I'm aware of CKEDITOR.config.baseFloatZIndex but even setting it to a zindex above the zindex of the window/dialog still results in the issue.
I managed to get it working with config.baseFloatZIndex = 102000;
but as you say, this doesn't work for you.

Resources