Skip to content

feat(VCarousel): add mousewheel prop for scroll navigation#22955

Closed
sridhar-3009 wants to merge 1 commit into
vuetifyjs:masterfrom
sridhar-3009:feat/carousel-mousewheel-22893
Closed

feat(VCarousel): add mousewheel prop for scroll navigation#22955
sridhar-3009 wants to merge 1 commit into
vuetifyjs:masterfrom
sridhar-3009:feat/carousel-mousewheel-22893

Conversation

@sridhar-3009

Copy link
Copy Markdown
Contributor

Closes #22893

Summary

Adds a mousewheel prop to v-carousel that enables mouse-wheel (and trackpad scroll) navigation between slides. Disabled by default to preserve existing behavior.

  • Scroll down / right → next slide
  • Scroll up / left → previous slide
  • 300ms cooldown prevents accidental multi-slide jumps per scroll gesture
  • Uses { passive: false } so preventDefault() suppresses page scrolling while hovering over the carousel
  • Handler is registered on mount and cleaned up on unmount; responds reactively if the prop is toggled at runtime

Usage

<v-carousel mousewheel>
  <v-carousel-item v-for="item in items" :key="item" />
</v-carousel>

Changes

  • packages/vuetify/src/components/VCarousel/VCarousel.tsx — add mousewheel prop and wheel event handler
  • packages/docs/src/examples/v-carousel/prop-mousewheel.vue — new example
  • packages/docs/src/pages/en/components/carousels.md — document the prop

@J-Sek

J-Sek commented Jun 28, 2026

Copy link
Copy Markdown
Contributor

closing in favor of #22906

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature Request] Add mouse wheel gesture support for navigation in v-carousel / v-window

2 participants