Is it possible to put Mapbox gl js map in page content but that it will be behind everything else?

I have this:

<Page>
  <div id="Mapbox-map"></div>
  <h1>Title</h1>
  <Button>Above the map</Button>
</Page>

I need that the map div will stretch all over the page but the title should be above this, also the button

  • the page also has tabs toolbar it also has to be on top of the map

How can I achieve something like that with F7? I am struggling with this a lot
and have many issues putting things to be visible above the map

Just add position: absolute for elements you need to be in front of the map and position them as required with CSS styles

hice una app con F7 el ejemplo del mapa con mapbox está hecha con gl js


Es totalmente funcional puedes ver la app en play store para ver su funcionamiento. Ya que no puedo poner más imágenes.

sonara algo raro pero lo metí dentro de un iFrame y funciona a la perfección.

Podes poner el enlace a la app, no la pude encontrar en la play store.