Global "Sticky" Footer

[lesliekirk]

Is it possible to convert the Global "Sticky" Header (ReadyTheme Content Sections fasten_header) to a Global "Sticky" Footer?

[lesliekirk]

I think I have an answer to my own question - using CSS - I've changed the .x-fasten-header top: 0; to bottom: 0;

Now to see how well that plays out. If I've missed anything, please let me know.

[RTHOMASDESIGN]

That'll work :)

Will likely look better if you change "transform-origin" to bottom as well.

[Bruce - PhosphorMedia]

Its relatively easier to do this anywhere you want. Just tag the element you want to stick with

{ postion: sticky }

and make sure that's inside a parent container that defines the area in which you want the sticky element to exist. (For example, a footer container, or even say a product image container, whatever).

next define its 'start' position using Top:0, Bottom:0, Left:0 and/or Right:0.

When scrolling reaches the trigger point, it will remain its starting position.

[RTHOMASDESIGN]

Yup "position:sticky" works great, but it isn't fully supported by some browsers (which is likely why Miva didn't use it). I often check CanIUse to ensure compatibility – https://caniuse.com/#search=sticky

[lesliekirk]

Yup "position:sticky" works great, but it isn't fully supported by some browsers (which is likely why Miva didn't use it). I often check CanIUse to ensure compatibility – https://caniuse.com/#search=sticky

Thanks - nice tip! I'll also go look for that "transform-origin" too. Along with doing multiple browser tests.