Floating groups behaviour

Hi,

i need help in understanding some logics of floating groups. In order to make some easy tests, i just inserted a simple squared floating group in the page. Here below a screenshot.

The parent group of this element is directly the page itself.

Here are the results i got changing the options of ‘vertically float relative to’'. The other 2 options are fixed in ‘‘above elements’’ and ‘‘right’’:

  • top: the elements is sticky as expected
  • bottom: the element diasppear
  • both: the element disappear
  • nothing: the element is not sticky, so it works as normal element in the page.

Can someone explain me those behaviour above? What should i expect from ‘‘bottom’’ and ‘‘both’’?

Thank you in advance

Andre

When you place the Floating Group relative to Bottom, it figures out the distance in Pixels from the bottom of the Floating Group to the very bottom of the Page. Then it will always place the Floating Group that many pixels above the Bottom of the Device Screen. So in your example, the yellow group is actually somewhere above the visible screen when you change it to ‘Bottom’

To test this, go to the very bottom of your Page and place the floating group there and use the ‘Bottom’ setting.

I haven’t played around much with ‘Both’, but I am guessing you would need to place it on a Page that is short in height


Geoff | Top Shelf Templates

1 Like

I was just trying Floating group out as well today. However, I wanted the specific Floating group in a popup, but I could not get it there. Can a Floating group onyl be on the main page?

3 Likes

Hi @gf_wolfer,

thank you so much. the bottom thing now does make sense to me (even if, honestly, i don’t understand why and when am i supposed to use it).

My next step, and what i what to reach, is actually creating a sidebarmenu. The reference is, for instance, what tripadvisor does in his website on mobile.

I managed to create a floating group that stays visible and sticked to the top of the page. What i still can’t do is block the heigh of the page, so that, once i open the sidebar menu, i can’t scroll the page anymore over the bottom of the sidebar menu.

Is that clear? in case is not, again, please give a look at the mentioned example.

Any idea?

Thank you :wink:

I use it to have a floating banner on the bottom of some of my Pages with a Call to Action button, it is especially useful for Mobile views (example :point_down:)

Screenshot_121118_125729_PM

Do you have link/screenshot/gif of the exact functionality you want?
A floating group will not stop a user from scrolling the page, but you can cover the whole page with one to give it the same feel

1 Like

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