AltTextUsing the Chroma Pro Stack

A marker controlled Slide Up Social Footer  

Look at the bottom of the page and watch the Chroma social bar as you scroll up and down

Get In Touch

                  
www.bigwhiteduck.com

Comments

This setup is slightly more complicated that using the Chroma (non Pro) stack.

If you just want to do a simple style change on fix then use the Chroma stack.

Chroma Pro allows a lot more control and the option to use more than one marker for other style changes further down the page.

Chroma Pro allows partial friendly inbuilt marker naming for use on site wide menus.

Setup Notes

Slide Up and Down

The Slide Animation control to Marker Activated.

For this example, the Initial State is set to Not In View

Because the slide up / down effect is now controlled by markers, we can decide exactly when to show and hide it.

This page just has one style with a marker change set to reverse. You can however use as many as you want.

Another idea is just to slide up the footer at the bottom of the page. With a full width Chroma Pro, you can then use it as your page footer but with a twist.

THIS IS NOT A REAL MENU. It is just to show Chroma in operation.

To use this Chroma setup simply replace the 3-column fake menu with your real menu.

Additional Info

Sizing the Chroma Pro footer.

Chroma Pro is set to Position Fixed and relative to the bottom of the page.

The width is set to Scale to Content s

Chroma handles the padding, rounded corners and the background color of the social bar. You can use any stacks you like to make the contents. This example just uses a Paragraph Pro with font awesome icons.

The social footer will show when the marker above this text reaches the top of the page.

Because it is set to reverse, it will hide again when the page is scrolled back.