How to make panel that appears only on scroll up or down

This is quite popular request on our support so it deserves separate article, because it’s quite simple to do this in Greenshift and usage is very wide. You can use it for sticked panels, headers, toolbars.

So, at first, let’s create toolbar. I will use DIV element and add there position fixed with 0 bottom value. But you can use any block. It doesn’t matter

Now, what I need is just few steps

  1. Enable Advanced Animation in Animation panel
  2. Add animation values. Highly likely it will be opacity as 0 and shift Y as 100% if you use it for bottom panel or shift Y as -100% if you use it for header
  3. Trigger type – use Observer and enable type and Down and Reverse on Up. If you want to make it appears only on scroll down. And Up and reverse on down if you need opposite
  4. in Custom trigger, use “body” or “window”
Screenshot

That’s all

«