页面随鼠标滚动或页面下拉一级header标签隐藏与浮现二级header导航顶边固定与恢复解析

功能描述：
1.页面有一级二级导航条，页面向下移动内容区域时，当移动一定距离后，一级导航条隐藏，二级导航条顶边固定；页面向下移动回到内容顶部时，一级导航条出现，二级导航条解除顶边固定，回到页面初始一级二级导航条布局状态

2.当二级导航条顶部固定后，页面内容区域继续向上移动，当移动到页面内容item区域后，二级导航条内对应item被选中高亮。

以上是需求描述，下面是实现

<template>
	<div class="tabs-main">
	    <div id="tabs-header" class="tabs-header">
	        <div class="tabs-header-main">
	            <div class="tabs-header-main-text">{
   {
   option.tabsTitle}}</div>
	            <div class="tabs-header-control">
	                <ul class="tabs-header-main-menu">
	                    <li class="tabs-header-main-menu-item" :class="{selected:index===option.selectedIndex}" v-for="(item,index) of option.menuData" :key="index" @click="pageView(item,index)">