Fixation when scroll

I’m new to bubbles and I need your help.
I want the floating group to stay on the red line when scrolling and not go into the footer. I tried to apply JS (placed in the html block), but it did not work. The floating group should scroll and stop at a specific location. How can I solve this problem? Thank you!
var element = document.getElementById(“fg”);
var stopPosition = 800;
window.addEventListener(“scroll”, function() {
var currentPosition = window.scrollY;
if (currentPosition >= stopPosition) { = “absolute”; = stopPosition + “px”;
} else { = “fixed”; = “0px”;

try to set it: float to bottom and top.

do you mean it?

exactly. You don’t need javascript or any code for what you want to achieve.

If I use this function, then the element does not scroll. I want it to scroll to a certain place and then stop. Or am I doing something wrong? is this what you’re looking for?

Sticky demo

Editor link

Then you can use a group and make the position of this group ‘sticky’ on scroll.

Or without being dependend on a script @daviddr17 suggested:

Or do you need to use a FG?

Yould also use just pure css:

  1. Give the group or element an id name at the bottom of the element settings

  2. put an html element on the page with the following html:

    #idname {
    position: sticky;
    top: 0;

  3. replace idname with the given id and replace 0 with your value

This will make your element sticky inside its container.

@daviddr17 or you could propose using no code… :wink:

1 Like

Thank you very much for your response. This option didn’t help. I use floating grout. When the page starts to scroll, the element simply disappears.
My code:

var fixmeTop = 150

$(window).scroll(function() {
var currentScroll = $(window).scrollTop();
if (currentScroll >= fixmeTop) {
position: ‘sticky’,
top: ‘20px’
} else {
position: ‘relative’,
top: ‘’

Thanks for the answer. This option didn’t work either. The element continues to work as before.

No worries, happy to help!

Is there a specific reason why you are using a floating group?

There is no specific reason. I can use the Group element. Do you think the problem is that I use floating group?

I think so yes.

Thank you! I’ll redo it now.

This solution worked! Many thanks for the help! :slightly_smiling_face:

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.