topic PopupMobile and Bootstrap Nav in ArcGIS JavaScript Maps SDK Questions

PopupMobile and Bootstrap Nav

DavidColey — Tue, 06 Oct 2015 16:38:51 GMT

Does anyone have any ideas on how to use the popupMobile and a bootstrap navbar-fixed-top together? No matter what I try css-wise for z indexing and/or padding I cannot get the popupMobile's navigation bar to display on top of the bootstrap navbar. Do I need to get into the helper methods for placement maybe?

Thanks

David

Re: PopupMobile and Bootstrap Nav

ChrisSmith7 — Tue, 06 Oct 2015 18:13:48 GMT

Not sure if I'm visualizing this correctly - is the problem exemplified in this jsfiddle I created?

Bootstrap nav bar; mobile popup ArcGIS - JSFiddle

Re: PopupMobile and Bootstrap Nav

ChrisSmith7 — Sat, 11 Dec 2021 16:25:59 GMT

If so, I was able to place it above the nav bar by adding a css override; here's the jsfiddle update:

Bootstrap nav bar; mobile popup ArcGIS - JSFiddle

And the overrides:

.esriMobileInfoView {z-index: 999999 !important;}
.esriMobilePopupInfoView {z-index: 999999 !important;}
.esriMobileNavigationBar {z-index: 999999 !important;}

Hope I understood your issue correctly!

Re: PopupMobile and Bootstrap Nav

DavidColey — Sat, 11 Dec 2021 16:26:02 GMT

That's exactly it Chris, thanks! It was driving me nuts. My z-index was too low (108 - based on WAB) and I was missing the .esriMobilePopupInfoView class. I now have:

.esriMobileInfoView , .esriMobilePopupInfoView, .esriMobileNavigationBar {
    z-index: 999999 !important;
}