vuetifyjs / vuetifyjs/vuetify

[Feature Request] Disable window scrolling while swiping horizontally on tab in phone

Open
#11,170 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

C: VTabs C: VWindow S: maybe T: enhancement
Dominant language
TypeScript
Stars
41k
Forks
7.1k
Avg merge
1d 21h
Merged PRs (30d)
11

Description

Problem to solve

The window scrolling up or down when you swiping horizontally in tab.
https://vuetifyjs.com/en/components/tabs/#tab-items
The whole page is scrolling up or down when I am swiping horizontally on tab. Open www.amazon.com, swiping Amazon's menu item, Amazon's menu only move horizontally buy not vertically at the same time.

Proposed solution

Disable window scrolling while swiping horizontally, the same issue is discuss in other open source project. https://github.com/akiran/react-slick/issues/1240

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the behavior on the Vuetify tabs demo at https://vuetifyjs.com/en/components/tabs/#tab-items using a phone or mobile viewport. Investigate the tabs component entry point and verify that horizontal swiping keeps the tab content moving without simultaneous vertical window scrolling.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.