Hello… This is just a little issue.
How do I know the scroll position of an element?
I want to add animations(transition in) when the scroll position is at the position of the element?
Is there an easy way to find the position of an element on the page? other than having to add up the total height of elements above
Hi there, @kendrickmiles2599… I have never used it, but you might want to check out this plugin.
Also, you have access in conditionals and workflows to an operator that can get the current page scrolling position, and I’m thinking that operator could be useful to you here.
Hope this helps.
Best…
Mike
What I mean is… I want to set some conditions like ’ when current page scrolling position is 1500px, make this element visible’… 1500px being the scroll position for that element…
In other words, I want to make elements like images to ‘not be visble on page load’ but animate in when a user scrolls to the image position (when it can be seen on screen)
You should be able to use either the plugin or the operator (or even a combination of both) to do what you described. For example, the first use case on the plugin’s page is “Animate an element when it becomes visible on screen”. You can also have the element be hidden until the scroll position reaches a certain point.
What have you tried?
I really don’t intend on using plugins… As I am very sure this can be done without them… I can animate the elements on scroll but I would to know the position of the element…
Which can be done by adding the heights of elements before it.( and that’s exhausting)
The major reason why I’m doing this is to reduce my pages’ load time… Do you have any tips on reducing load time?
If that’s what you are trying to accomplish, I wouldn’t go about it by hiding elements and then animating them when they are visible.
Do you actually have a load time problem or are you just anticipating having a problem? This recent-ish update by Bubble should be helping with your load times.
By the way, if you really do just want to get an element’s scroll position, one hacky way to get it is to add a workflow to the element to save it’s scroll position to a custom state when the element is clicked, and put an element somewhere on the page so you can see the value of the custom state. Then, load the page, scroll to the element, click the element, and note the value of the custom state.
This topic was automatically closed after 70 days. New replies are no longer allowed.
