Skip to content

fix(components): prevent carousel from auto playing#14553

Merged
btea merged 1 commit intoelement-plus:devfrom
cuongle-hdwebsoft:fix-carousel
Oct 15, 2023
Merged

fix(components): prevent carousel from auto playing#14553
btea merged 1 commit intoelement-plus:devfrom
cuongle-hdwebsoft:fix-carousel

Conversation

@cuongle-hdwebsoft
Copy link
Copy Markdown
Contributor

@cuongle-hdwebsoft cuongle-hdwebsoft commented Oct 15, 2023 •
edited
Loading

prevent carousel from auto playing

closed #14524

Please make sure these boxes are checked before submitting your PR, thank you!

  • Make sure you follow contributing guide English | (中文 | Español | Français).
  • Make sure you are merging your commits to dev branch.
  • Add some descriptions and refer to relative issues for your PR.

Description

🤖 Generated by Copilot at 88f2ce6

Fixed a bug in use-carousel.ts that ignored the pauseOnHover prop of the carousel component. This improves the user experience and accessibility of the carousel.

Related Issue

Fixes #14524

Explanation of Changes

🤖 Generated by Copilot at 88f2ce6

  • Fix a bug where the carousel would resume autoplaying after the mouse leaves, even if pauseOnHover is true (link)

@pull-request-triage
Copy link
Copy Markdown

pull-request-triage bot commented Oct 15, 2023

👋 @cuongle-hdwebsoft, thank you for contributing element-plus.

  • You can comment with /label Components:[component_name] to add a label for which component you are working on.
  • You may join our Discord for staying tuned.

@github-actions
Copy link
Copy Markdown

github-actions bot commented Oct 15, 2023

Hello @cuongle-hdwebsoft, thank you for contributing to element-plus, please see our guideline to see how to make contribution

@github-actions
Copy link
Copy Markdown

github-actions bot commented Oct 15, 2023 •
edited
Loading

@github-actions github-actions bot added the CommitMessage::Qualified Qualified commit message label Oct 15, 2023
@github-actions
Copy link
Copy Markdown

github-actions bot commented Oct 15, 2023

🧪 Playground Preview: https://element-plus.run/?pr=14553
Please comment the example via this playground if needed.

@cuongle-hdwebsoft
Copy link
Copy Markdown
Contributor Author

cuongle-hdwebsoft commented Oct 15, 2023 •
edited
Loading

Here is demo

Testing step:

  • Click on the next arrow icon
  • Confirm that it should display the next carousel item and automatically play the next item.
  • Move your mouse out of the carousel
  • Confirm that it should auto-play again
CleanShot.2023-10-15.at.14.05.56.mp4

btea
btea approved these changes Oct 15, 2023
View reviewed changes
Copy link
Copy Markdown
Member

@btea btea left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks!

@btea btea merged commit cea19ac into element-plus:dev Oct 15, 2023
cc-hearts pushed a commit to cc-hearts/element-plus that referenced this pull request Oct 15, 2023
@cuongle-hdwebsoft @cc-hearts
fix(components): prevent carousel from auto playing (element-plus#14553)
3a3aed4 
prevent carousel from auto playing

closed element-plus#14524
@element-bot element-bot mentioned this pull request Oct 18, 2023
Merged
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@tolking tolking tolking approved these changes

@btea btea btea approved these changes

Assignees

@cuongle-hdwebsoft cuongle-hdwebsoft

Labels

CommitMessage::Qualified Qualified commit message Contribution::Community Needs Review

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Component] [carousel, carousel-item] Carousel设置pause-on-hover为true时 点击左右箭头切换后失效

3 participants

@cuongle-hdwebsoft @tolking @btea