programmatic smooth scrolling

🔎 Usage Questions

Is it possible to programmatically smooth scroll? I’m trying to get a “scroll to top” button working without jumping right back to the top all jittery and ugly -like.

My current code:

 $('.go-top').click(function(event) {
    event.preventDefault();
    let bodyscrollTop = simpleBar.getScrollElement()
    bodyscrollTop.scrollTop = 0
    // let bodyscrollTopTop = bodyscrollTop.scrollTop
    // $('html, body').animate({bodyscrollTopTop: 0}, 300);
})

That works, but jumps immediately back to the top, which isnt great UX…

The commented out portion is how I would expect to be able to do it smoothly, however that doesnt work at all. No Action. It does not generate any error messages either…

I’ve tried the scrollIntoView() method as well. That doesnt work either.

Is this simply not possible with simplebar or am I missing something?

[Rod911]

You could also try

[data-simplebar]:not(.simplebar-dragging) .simplebar-content-wrapper {
	scroll-behavior: smooth;
}

[Rod911]

@darkmodeee Codepen See, works like a charm, I find the link tag works better for nested scrollbars as it scrolls both parent and child to get the element into view