past osprey
Hi I am currently working on this page that has a back to top button https://355232a4eb.nxcli.net/board-development/ it uses an anchor tag but I also used this script to allow it to scroll to the top once you click on it. It seems to be working as expected on desktop but works incredibly inconsistently on mobile (i've tested both on my pixel and iphone). Not sure if anyone has any insight that might help or more info I can offer. Note the back to top button only shows up once you've scrolled down the page a bit.
This is the code
class ScrollToLink {
constructor() {
this.root = $('html, body');
this.menu = $('.nav-wrapper');
this.init();
this.events();
}
events() {
$('a[href^="/#"],a[href^="#"]').on('click', this.offsetAnchor.bind(this));
}
init() {
if ($(location.hash).length != 0) {
// let time = $(location.hash).offset().top - 50 > 4000 ? 2500 : 1500;
this.root.animate({scrollTop:$(location.hash).offset().top - 50}, 0);
}
}
offsetAnchor(event) {
// this.menu.removeClass('active');
document.documentElement.style.overflow = 'scroll';
document.body.scroll = "yes";
event.preventDefault();
let link = $(event.currentTarget)[0];
let href = link.hash;
let time = 1500;
if($(href) && $(href).offset() && $(href).offset().top) {
$(href).offset().top - 50 > 4000 ? 2500 : 1500;
this.root.animate({
scrollTop: $(href).offset().top - 100
}, time);
}
}
}
export default ScrollToLink;
feral widget
digital matrix