Nw.js: Disable the "bounce" effect on scroll

[nikkow]

Hello,

I'm using the latest alpha version of NW.JS (yes, I know, it's "only" alpha...). Thing is, I'm running it on Mac OSX 10.10 and I have this "bounce" effect when I want to over-scroll the page (top and bottom).

I read awhile ago that the Chromium team was not planning to fix it (see here), as it is supposed to follow Apple's guidelines. However, is there a way to disable it in NW.JS? It clearly does not have the look of a native app with this ugly effect.

I've tried some tricks that are known to work on mobile Safari (settings the main container to absolute, etc...) but they're not working in that case.

Thanks,
N.

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[PierBover]

You could maybe control all the scrolling via JS and put all your content into a container with overflow hidden.

[nikkow]

I managed to disable de bounce effect by watching the scroll on the document. I put the JS code I used here: https://gist.github.com/nikkow/9e249af14d8607c5f649
Since I don't need to have a scroll bar, I don't know how it reacts with scrollable div.

[ABeltramo]

@nikkow your code disable all the scroll in the page.
To only remove the bounce effect you should put this css trick

html, body {
  height: 100%;
  overflow: hidden;
}

[nikkow]

@ABeltramo thanks for the hint. It didn't work with 0.12-alpha3, when I opened the thread (just tested again with this version). It has been updated since then, and with the latest version (0.12.2) it is now working again.

[talldude]

I'd love to see this be a setting in package.json, or an App setting - the trick above for setting overflow to hidden DOES work, but it has the side effect of breaking scroll events in jQuery and you're left trying to hack in your own.

[fritx]

Thanks for tips from @ABeltramo, will try soon

[achekulaev]

This solution is not good. If content is longer then the window then it will not scroll.
You need this

html, body {
  height: 100%;
  width: 100%;
  overflow: auto;
}
html { 
  overflow: hidden;
}

[Christywl]

Is this issue still reproduced on the latest nwjs build? If so, could you please provide your full test to reproduce it?

[Christywl]

close until there is more information.