Scenelist scroll auto-hiding address bar on Chrome Mobile

80 views
Skip to first unread message

Kris

unread,
Feb 15, 2021, 6:37:03 AM2/15/21
to marzipano
Hi.

I have a problem with the menu system when using a long list of scenes.  I have a tour with maybe 30 scenes in.  

With this many scenes, Chrome Mobile will auto-hide the address bar when scrolling the scenelist upwards.  Unfortunately, it stays auto-hid when we use the toggle to close the scenelist, resulting in mobile users not being able to access their address bar and tab buttons when they return to their tour.  It also leaves an ugly black bar across the bottom.  

Is there any css magic that anybody knows to prevent the Chrome Mobile browser from triggering the auto-hide option when we have a long list of scenes in our tours?  

Thanks in advance if you are able to help!

Kris.

---

Current .css is this (btw, I changed to height :auto to retain the background colour when scrolling large scenelists):

.mobile #sceneList {
  width: 100%;
  height: auto;
  left: -100%;
}

Images demonstrating the problem:

ScenelistError01.JPG

ScenelistError02.JPG

ScenelistError03.JPG





 

Kris

unread,
Feb 16, 2021, 3:06:01 AM2/16/21
to marzipano
I think I've found the solution, or rather corrected the error I introduced earlier.  

Happy to be corrected by the more knowledgeable if you think I'm wrong

Return the .mobile #sceneList in .css to its original state (of height: 100%;) -  

.mobile #sceneList {
  width: 100%;
  height: 100%;
  left: -100%;
}

and add overflow-y below to .mobile #sceneList .scenes

.mobile #sceneList .scenes {
  height: 100%;
  overflow-y: auto;
}

Now, the scrolling of the long scenelist does not trigger auto-hide of the URL bar in Chrome Mobile and the background-color remains when using long scene lists.




 



Reply all
Reply to author
Forward
0 new messages