CODEWITHSUNDEEP
google-chrome
raulmarcosl
raulmarcosl

Reputation: 823

Disable Chrome two fingers back/forward swipe

I have a page where the user can scroll horizontally the content, and in Chrome this scroll action sometimes triggers the two fingers back/forward swipe.

How can I deactivate this Chrome's function in a specific page, without disabling horizontal scroll?

Upvotes: 24

Views: 11121

Answers (5)

P. Navarro
P. Navarro

Reputation: 115

Posting a non-CSS answer, which sometimes you don't have access to.

Run chromium / chrome with the disable-features=OverscrollHistoryNavigation :

# Run Chromium or Chrome with following flag
chromium --disable-features=OverscrollHistoryNavigation

Other gesture-related flags are usually recommended (such as the one that disables zooming via pinch, --disable-pinch), can be found here: https://niek.github.io/chrome-features/, which is a blog post recommended on the official docs (here, down bottom)

Upvotes: 3

Ramkrishan Sahu
Ramkrishan Sahu

Reputation: 194

Go to Chrome flags by pasting Chrome://flags in the address bar and search for Overscroll history navigation and change this from default to Disabled

It will prompt to restart the browser, restart it.

This should solve it.

Upvotes: 3

tbjgolden
tbjgolden

Reputation: 1335

After way too long, I discovered this:

html, body {
  overscroll-behavior-x: none;
}

Upvotes: 40

Satyam Naolekar
Satyam Naolekar

Reputation: 560

I have found that this chrome setting disabled the behavior: chrome://flags/#overscroll-history-navigation

Just disable overscroll, it will disable the page navigation using the scroll but normal horizontal scroll on the page will work. Tested on my end.

Upvotes: 5

Anson Kao
Anson Kao

Reputation: 5375

It is only possible to disable this feature by disabling scrolling itself:

With jQuery:

('body').on('wheel', function(e){ e.preventDefault(); });

Without jQuery:

document.body.addEventListener('wheel', function(e){ e.preventDefault(); });

This code will work in Modern browsers but is not cross-browser tested. Also, MAJOR CAVEAT: if you still want the users to be able to scroll the page, you'll have to roll your own scrolling to make it all work.

Upvotes: 2

Related Questions