粘性布局position:sticky

网站顶部的导航栏固定与否，显示隐藏与否的问题？
如果不固定（position: relative），那么滚屏时，导航栏就看不到了，如果需要定位点击导航栏的某个选项跳转页面时比较麻烦，要先返回顶部，然后再点击跳转。
如果固定（position：fixed），那么无论滚屏与否，始终有个导航栏浮在页面内容上面，特别是第一屏内容，会被挡住某部分，当然对第一屏处理一下就行了。
虽然用js控制css，可以实现两种方式的结合，但是在手机端的会出现其他问题。就想有没有两者结合的css属性，结果找到了粘性布局属性position:sticky，当然兼容性还不太好。但是这篇文章（position:sticky实现iOS6+下的粘性布局，相关代码栗子），可以解决这个问题。
到这里，已经挺不错了。但是我还想更好点。

1. 页面一出来导航栏位于最顶部
2. 滚屏时，导航栏浮在顶部，不会消失。
3. 滚多屏时，不想看到导航栏，当我需要关注时在出现再顶部。

到目前为止只解决了前面2点。最后一点，通过搜索，找到了，一个好的思路，就是IBM官网的导航栏。

参考

• position:sticky实现iOS6+下的粘性布局
• IBM官网