Get target scroll position of a smooth scroll element.
Question:
Is there any way to get the target scroll position/point and not the current scroll position.
I am able to get element.scrollLeft but thats current scroll position, I want the position where browser will stop the smooth scroll or stop the scroll "animation".
What I am trying to do:
I have a slide show which can be slid by classic scroll (scroll wheel or scroll bar) or left and right buttons that I have added...
Now I am trying to disable the left or right button when there is no more scrolling that can be done...
3 Replies
^ Photo of the slide show.
Images used are temporary and I have no rights of them, its only for testing and visualizing
so if I'm getting u right, what u want is to disable to arrow buttons once the slide hits the edge
i have made a slider in codepen where i think i solved similar issue but i can't log in to codepen for some reason
ig a way u can try solving this is as follows,
put 2 pseudo element or a div on 2 edges of the slider. On scroll, get the x position of those 2 elements.
if the x position of the element on the left edge is 0, that means u r on the far left of the slider
if the x position of the element on the right edge is equal to the innerWidth then u hit the right edge of the slider
now looking at the img u sent, u will have to offset those values by the padding u have on both sides of your webpage
if padding = p amount
then for element on the left edge , the x position needs to be equal to p
and for the element on the right edge, the x position needs to be eqaul to innerWidth - p
I have already implemented that behavior.
The problem is that slider element is a smooth scroll element so when I give input to scroll to end it takes time for the actual element.scrollLeft to reach there.
What I want to do is to check if browser is eventually going to smoothly slide and stop at the edge and disable the arrow button in advance.
I want the target slider position, where the slider will eventually stop.