This has been a 6+ hour, incredibly frustrating situation.
Iām trying to make a simple sidebar dashboard like Twitter in where it floats on the screen but sticks to a scrolling group in the middle. Please see the video below and keep an eye on the two sidebars as I zoom out and in.
This is what Iāve tried and what DOESNāT work (along with the reason why it doesnāt work):
A Floating Group on the left and right side (Floating Groups stick to the edges of the screen and do not stick to the middle)
One large Floating Group that stretches across the screen and then having fixed-width groups inside as the sidebars (you canāt click elements underneath a transparent Floating Group which makes the middle group unusable)
*A ābeneath the pageā Floating Group and then have the main page transparent (you canāt click elements in a Floating Group beneath the page even though the full page is transparent)
A Group Focus attached to the header (the Group Focus closes whenever you click anywhere on the page)
Float relative too Plugins (It glitches, groups donāt appear, etc.)
This would all be solved if transparent Floating Groups behaved like transparent regular Groups. But there must be a reason why you canāt through Floating groups?
It doesnāt- having it float vertically is not the issue. Itās having it stick to a proper horizontal reference (having it stick to the middle column like in the GIF)
A couple different things you could do that I can think ofā¦
Install the free classify plugin and add CSS to make a regular group behave as a floating group (requires some knowledge of CSS)
Install the paid plugin by BDK which is a floating group plugin to allow you to turn any element into a floating element.
The reason you are having a hard time with this setup as you are trying it, is because it is impossible (at least from my frustrating weeks spent trying to do similar) with a floating group element provided by Bubble because that floating element is āconnectedā to the page and is not capable of being contained by other elements except the page and therefore can not be āconnectedā to other elements on your page.
Does this allow to use a floating group on the right side of the screen or position anywhere on page without overlapping other elements?
This would be great to add a floating group to the right of the screen and ābumpā it from the right margin. I took a look at the editor in the linked postā¦the right side short group would be great to float and I personally tried to find a way to do something like that without a plugin.
@duke.severn So I did come across your solution during my research but ignored it because the preview didnāt quite do what I needed. The floating groups on the sides still stuck relative to the sides on zoom out. Bumping the floating group from the edges isnāt an issue though overlapping elements is - this solution moves us one step closer.
I need it to stick relative to the center group. Can you tell me what each editable part of your code snippet does and where I can change it to possibly make it work? Iāve tried a few things but still no luck. (Iām not a programmer but can usually hash things out)