Javascript 如何自动滚动页脚以聚焦ionic3中突出显示的特定div

我正在尝试将ionic3页脚自动滚动到焦点div，比如，我的主页上有9个菜单，页脚上有9个菜单图标，如果我单击页脚上的图标，它就会转到特定的页面，进入该页面后，我的页脚必须滚动到特定的页面图标，但我不明白，请设法解决这个问题

下面是我目前的行为形象

预期行为形象

就像我进入航班页面时的最后一张图片一样，我的页脚必须向上滚动到该图标，但现在它没有发生

这是我的密码

家

行程

聊天

关于

::
：//所有页脚图标
::
飞行

    <ion-footer>
    <div style="display:inline-flex;border-top: 1px solid #b3b3b3;overflow-x:auto;" class="scroll-content" #footerCont (ionScroll)="scrollHandler($event)">
        <div class="col" [navPush]="homePage" [ngStyle]="pageName == 'homePage' && {'color': themePrimaryColor}">
            <ion-icon name="footer-home"></ion-icon>
            <p>Home</p>
        </div>
        <div class="col" [navPush]="itineraryPage" [ngStyle]="pageName == 'itineraryPage' && {'color': themePrimaryColor}">
            <ion-icon name="footer-itinerary"></ion-icon>
            <p>itinerary</p>
        </div>
        <div class="col " [navPush]="chatPage" [ngStyle]="pageName == 'chatPage' && {'color': themePrimaryColor}">
            <ion-icon  name="footer-chat-bubble-two"></ion-icon>
            <p>chat</p>
        </div>
        <div class="col"  [ngStyle]="pageName == 'aboutPage' && {'color': themePrimaryColor}">
            <ion-icon  name="footer-about"></ion-icon>
            <p>About</p>
        </div>
       ::
       :://all footer icons
       ::
        <div class="col"  [ngStyle]="pageName == 'flghtsPage' && {'color': themePrimaryColor}">
            <ion-icon  name="footer-flights"></ion-icon>
            <p>flights</p>
        </div>
  </div>
</ion-footer>