I've created this **Fiddle**: <https://jsfiddle.net/empafmw8/>

I've got everything working fine, but when you scroll back to top of the site, `.sticky-header` will change it's `position` to `relative` when you scroll on 0. But I need to do it, when `.first` will appear on the screen. 

I also need it to work, if `.first` would have `height: 100%`

I tried something like `else if ($(window).scrollTop() == 800px)` or `else if ($(window).scrollTop() == 100%)` But it's not working.