[Bug Report][3.6.7] show-arrows="hover" not work when using v-slot:prev or v-slot:next in v-carousel

vuetifyjs / vuetify

🐉 Vue Component Framework

https://vuetifyjs.com

MIT License

39.6k stars 6.95k forks source link

[Bug Report][3.6.7] show-arrows="hover" not work when using v-slot:prev or v-slot:next in v-carousel #19862

Open wureka opened 3 months ago

wureka commented 3 months ago

Environment

Vuetify Version: 3.6.7 Vue Version: 3.4.27 Browsers: Chrome 125.0.0.0, Mozilla Firefox, Microsoft Edge, Opera OS: Linux x86_64

Steps to reproduce

You may just use the sample provided in https://vuetifyjs.com/zh-Hans/components/carousels/

Expected Behavior

prev icon and next icon should disappear when mouse move out of carousel area

Actual Behavior

prev icon and next icon keep showing on carousel area

Reproduction Link

https://play.vuetifyjs.com/#...

admg commented 1 month ago

I found a workaround. Add classes to your custom arrows: v-window__left and v-window__right. Those classes have animations defined in css for default arrows.