Menu icon Foundation
Multiple sticky elements with Magellan

Hello all,

While I'm having no problem getting one element to stick to the top of the browser, I cannot figure out a way to have multiple elements stick one underneath the last.

For example, I would like to scroll through...

HEADLINE (sticky)
Lorem ipsum dolor

SUB-HEAD 1 (sticky)
Lorem ipsum dolor

SUB-HEAD 2 (sticky)

... to end up like:

HEADLINE
SUB-HEAD 1
SUB-HEAD 2

Does anyone have a solution for this? Any assistance would be greatly appreciated.

Terry.

Magellanmultiplesticky

Hello all,

While I'm having no problem getting one element to stick to the top of the browser, I cannot figure out a way to have multiple elements stick one underneath the last.

For example, I would like to scroll through...

HEADLINE (sticky)
Lorem ipsum dolor

SUB-HEAD 1 (sticky)
Lorem ipsum dolor

SUB-HEAD 2 (sticky)

... to end up like:

HEADLINE
SUB-HEAD 1
SUB-HEAD 2

Does anyone have a solution for this? Any assistance would be greatly appreciated.

Terry.

Rafi Benkual over 5 years ago

Can you post the code you are working with?

nicotr014 about 5 years ago

Hello, have you found a solution for multiple sticky top-bars?

Martin Fairall over 4 years ago

id really like to know how to do this to (bump)

Rafi Benkual over 4 years ago

Can you provide an example of the component you are trying to use? Is it Magellan? Top-bar? NO component? Share your code so we can help you more.

Jenny over 4 years ago

Hello,

I'm looking to have multiple magellan on one page as well, using tabs specifically.

Any solution to this?

Thanks!
jenny

Rafi Benkual over 4 years ago

It would be easy enough to do. Here is an example of Magellan and tabs: http://codepen.io/rafibomb/pen/YPbQoE