Avoid elastic dragging, in standalone app

Questions
#1

If I create a new standalone app in FW7 beta 26 (or earlier), the page-content is draggable down.

I tried it from a fresh install:

  • framework7 create --ui
  • create a standalone app (‘Add to homescreen’)
  • upon launch, you can drag the whole app down (an thus get the elastic animation)
  • after some tapping, the page-content stais fixed

Is there a way I can suppress this?

iOS 12.1.2
Framework7 beta 26

#2

In config.xml:
<preference name="DisallowOverscroll" value="true" />

#3

In a standalone webapp there is no config.xml - I am NOT talking about a compiled (Cordova/PhoneGap) app.

#4

There are several ways to achieve that. If your app pages have navbar and toolbar all the time, then i think it is better to set navbar/toolbar bg color to html element, e.g. (in v4)

html {
  background-color: var(--f7-bars-bg-color);
}

To totally block it you can try:

html {
  position: fixed;
}

But result could be weird with input elements

#5

Anyway, any solution is hacky. I was also thinking about adding this functionality into F7 core, but all i tried are still hacky and can cause other issues.

#6

Yes - you’re right… I’ve been trying to hack around this, but there’s no good solution for now…