jQuery Rondell Scroller and jQuery UI Dialog don't play nice (z-index)

Hello all,

I have a Rondell jQuery scroller plugin and wish to use a number of jQuery UI dialog widgets on the same set of pages with the scrollers. However, the z-index of the dialog widget cannot be set to what I need, i.e. on top of everything (modal only partly works), no matter what I have tried. I have searched through the jQuery UI site, tried the options from the docs and from user suggestions for dialog widgets all to no avail. These are a few tries:

this.css('z-index', 100000);

dialog("moveToTop");

beforeShow: function () {"moveToTop",{modal: true, width: 670}}

I have read that setting the !important flag on the dialog CSS would work, but it hasn't for me. Also, someone had mentioned that the z-index was removed in the latest versions of jQuery UI (for more than just dialog widget?) and that you should let the "normal stacking" take place. I have been unable to find more on that in the docs.

Replies(2)

mike_laird

Re: jQuery Rondell Scroller and jQuery UI Dialog don't play nice (z-index)

7 years ago

Yes, the Dialog widget used to have a z-index option. It has been removed in one of the recent jQueryUI updates. I'm pretty sure that is mentioned in the Dialog documentation or in the recent UI upgrade guide. If its in the upgrade guide, it may describe some alternatives.

One alternative is to use an old UI version, like jQuery 1.9.2, but of course that looses all the recent improvements. Another alternative is that the Rondell Scroller has bugs in it. Have you posted the problem in the Plug-in Forum? If you come to suspect a bug in Rondell, let the developer know. Good plug-in developers fix their bugs. Other plug-in developers have done it for me.

Its hard to be more specific because the problem statement (modal partly works) is vague and there's no code.

jcharlesb..

Re: jQuery Rondell Scroller and jQuery UI Dialog don't play nice (z-index)

7 years ago

Thanks Mike, I meant the modal greys out the background, but the Rondell scroller is on top of the dialogs. I don't know if this helps, but I will post in the plugins forum. Thanks for the help!

Response title

Attachments

jQuery Forum