# Lock Background - Popup

**URL:** <https://forum.bubble.io/t/lock-background-popup/300734>\
**Category:** Need help\
**Created:** [January 5, 2024, 11:11pm UTC](https://forum.bubble.io/t/lock-background-popup/300734 "2024-01-05T23:11:11Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![thethinklab.au](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/thethinklab.au/32/156912_2.png) [@thethinklab.au](https://forum.bubble.io/u/thethinklab.au)\
**Post date:** [January 5, 2024, 11:11pm UTC](https://forum.bubble.io/t/lock-background-popup/300734/1 "2024-01-05T23:11:11Z")

</div>

Does anyone know how to lock backgrounds under Popups and Floating Groups?

I’m fine without it on a desktop, but on mobile devices sometimes the screen has issues on the ‘which’ container to scroll. E.g. popup/floating-group open, try scroll, but scrolls the screen underneath

---

<div class="post-metadata">

**Author:** ![hergin](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/hergin/32/199185_2.png) [@hergin](https://forum.bubble.io/u/hergin)\
**Post date:** [January 6, 2024, 2:03am UTC](https://forum.bubble.io/t/lock-background-popup/300734/2 "2024-01-06T02:03:52Z")

</div>

If I understand correctly, you can give a fixed height to the popup and it will scroll just by itself.

For example, this is the behavior without a fixed height (INF max height):  
 ![popup-scroll1](https://us1.discourse-cdn.com/bubble/original/3X/0/6/06722bd3152c45833d39335a3c0e5770acaedaf3.gif)

And this is the behavior with fixed height (80%):  
 ![popup-scroll2](https://us1.discourse-cdn.com/bubble/original/3X/1/0/10d7bd4738ecdb38656454251c2c86ef205645e5.gif)

---

<div class="post-metadata">

**Author:** ![thethinklab.au](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/thethinklab.au/32/156912_2.png) [@thethinklab.au](https://forum.bubble.io/u/thethinklab.au)\
**Post date:** [January 6, 2024, 5:21am UTC](https://forum.bubble.io/t/lock-background-popup/300734/3 "2024-01-06T05:21:19Z")

</div>

Sorry, I should have included an example. This is my specific issue:

Floating Group open: [https://youtu.be/8h8CX8i71WI?si=YOljBUJag8lLajXj](https://youtu.be/8h8CX8i71WI?si=YOljBUJag8lLajXj)

---

<div class="post-metadata">

**Author:** ![stuart4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/stuart4/32/250415_2.png) [@stuart4](https://forum.bubble.io/u/stuart4)\
**Post date:** [January 6, 2024, 5:54am UTC](https://forum.bubble.io/t/lock-background-popup/300734/4 "2024-01-06T05:54:02Z")

</div>

you are looking for:

/\* CRUD floating group on page fixed position \*/  
.fixed-page {  
position: fixed!important;  
}

youll need to add a class or ID to the page where you want this to be fixed… there are a number of ways to do it, but this is one way.

if you add an html element to the page and make it 0px wide, 0px high.  
then add:

/\* note on what this does \*/ .fixed-page { position: fixed!important; }

Add the [Classify](http://forum.bubble.io/t/classify-4-a-tiny-plugin-that-brings-css-classes-and/67741) plugin ( you dont need this, but you will in the future, if you havent already)

now in the popup or floating group create a text state called ‘fixed page’ - or whatever.

When you trigger open the popup change the ‘fixed page’ state text to: {tempClass: “my-class”}

When you close the popup, fg, just clear the state (make it empty, nothing) - this uses the new temp classed in Classify.

On the page add the state of the fg, or popup you created above.

 ![image](https://us1.discourse-cdn.com/bubble/original/3X/7/6/76185a79209494af4c93bf1329a7dc4c21fc631f.png)

This should do it for you. (ill assume your a fellow aussie 🙂 by the name)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/bubble/original/3X/2/8/2847faa74692c2ffa5d939d3dc3724cdd060d247.png) [@system](https://forum.bubble.io/u/system)\
**Post date:** [March 15, 2024, 11:11pm UTC](https://forum.bubble.io/t/lock-background-popup/300734/5 "2024-03-15T23:11:12Z")

</div>

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