Skip to content

Fixed button hiding #932 #934

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 1 commit into from
Mar 12, 2025
Merged

Fixed button hiding #932 #934

merged 1 commit into from
Mar 12, 2025
+84 −24

Conversation

ia319
Copy link
Contributor

@ia319 ia319 commented Mar 11, 2025 •
edited
Loading

Description

Fixed visibility issue with scroll-to-top button.

  • Replaced v-if with v-show for smoother transitions.
  • Added Transition for fade and slide animations.
  • Cached results using showScrollTopButton's compute property.
  • Implemented throttling and buffering for scroll events.
  • Fixed an issue where buttons could not be hidden during fast scrolling.
  • Adjusted visibility threshold to 200px for better user experience.
  • Enhanced accessibility with ARIA properties and focus styles.
    • Support for screen readers and keyboard navigation.
  • Added error handling to scrollToTop to improve robustness.
    • Ensures scrolling works reliably in different environments.

Related issue

Fixes #932

How Has This Been Tested?

  • After running run dev, it runs as expected and still works fine in emulated mobile device mode (Windows 11, Chrome's emulated mobile device mode (using the shortcut CTRL+Shift+M).
  • No other features affected.

Screenshots (if appropriate)

N/A

Types of changes

  • Bug fix (non-breaking change which fixes an issue)

Checklist:

  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.

@ia319
Fixed button hiding InternetHealthReport#932
a5f8da0 
Fixed visibility issue with scroll-to-top button:
- Replaced v-if with v-show for smoother transitions.
- Added <Transition> for fade and slide animations.
- Cached results using showScrollTopButton's compute property.
- Implemented throttling and buffering for scroll events.
  - Fixed an issue where buttons could not be hidden during fast scrolling.
- Adjusted visibility threshold to 200px for better user experience.
- Enhanced accessibility with ARIA properties and focus styles.
  - Support for screen readers and keyboard navigation.
- Added error handling to scrollToTop to improve robustness.
  - Ensures scrolling works reliably in different environments.

Resolved: InternetHealthReport#932
@dpgiakatos dpgiakatos self-requested a review March 12, 2025 01:34
dpgiakatos
dpgiakatos approved these changes Mar 12, 2025
View reviewed changes
Copy link
Member

@dpgiakatos dpgiakatos left a comment

Choose a reason for hiding this comment

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

Thanks. Also, nice description/code presentation.

@dpgiakatos dpgiakatos merged commit f4ddca3 into InternetHealthReport:master Mar 12, 2025
6 of 10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@dpgiakatos dpgiakatos dpgiakatos approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

The ‘Back to top’ button is not hidden correctly at the top of the page.
2 participants
@ia319 @dpgiakatos