search

HacktoberfestinAba / HacktoberfestinAba.github.io

Official landing page for the Hacktoberfest event in Aba, Nigeria.
https://HacktoberfestinAba.github.io
MIT License
8 stars 83 forks source link

Back To Top #124

Open UcheSylvester opened 5 years ago

UcheSylvester commented 5 years ago

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Scrolling back to the top of the page (especially to see the amazing cover photos :) ) can be an issue.

Describe the solution you'd like A clear and concise description of what you want to happen.

A Back-To-Top button, that when clicked on, takes users back to the top of the page. It'll only display when users are further down the page and will disappear/hide when they are already at the top.

Rye-Guy commented 5 years ago

@UcheSylvester My fix: A element that is fixed positioned in the certain position of the screen bottom left or right. This element is aware of the current ScollPosition of the screen on the vertical axis and will inherit a display property or toggle class to animate button to appear/hide depending on this ScrollPosition value.

When this element is clicked it will scroll to a element at the top of the screen with ele.scrollIntoView(alignTop:true). Smooth scrolling is a available option as well.

My solution will be very similar to my suggestions. Please assign to myself and I will fork and work on this based on your reply. Surprised to see no one jump on this issue yet; I'm happy to contribute :D