title: Why does my navigation bar disappear when scrolling?
body: <p>This is the website I'm currently have to work with: <a href="https://www.mpc.gov.my/home" rel="nofollow noreferrer">https://www.mpc.gov.my/home</a>. Everything seems fine when you view using a desktop or big screen, but when you try to browse it using a mobile/smaller screen the navigation menu is giving the user a headache.</p>
  <p>How can I fix it? I don't want the menu to disappear if I scroll down. Anyone get any ideas?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
    "use strict";
    
    $('.menu &gt; ul &gt; li:has( &gt; ul)').addClass('menu-dropdown-icon');
    $('.menu &gt; ul &gt; li &gt; ul:not(:has(ul))').addClass('normal-sub');
    $(".menu &gt; ul").before("&lt;a href=\"#\" class=\"menu-mobile\"&gt;&amp;nbsp;&lt;/a&gt;");
    
    $(".menu &gt; ul &gt; li").hover(function(e) {
      if ($(window).width() &gt; 943) {
        $(this).children("ul").stop(true, false).fadeToggle(150);
        e.preventDefault();
      }
    });
    
    $(".menu &gt; ul &gt; li").click(function() {
      if ($(window).width() &lt;= 943) {
        $(this).children("ul").fadeToggle(150);
      }
    });
    
    $(".menu-mobile").click(function(e) {
      $(".menu &gt; ul").toggleClass('show-on-mobile');
      e.preventDefault();
    });
  });
  
  $(window).resize(function() {
    $(".menu &gt; ul &gt; li").children("ul").hide();
    $(".menu &gt; ul").removeClass('show-on-mobile');
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*===================================
                Third Mega Menu
      =====================================*/
  
  .menu {
    width: 100%;
  }
  
  .menu-container {
    margin: 0 auto;
    background: #e9e9e9;
  }
  
  .menu a.logo {
    display: inline-block;
    padding: 1.5em 3em;
    width: 19%;
    float: left;
  }
  
  .menu img {
    max-width: 100%;
  }
  
  .menu-mobile {
    display: none;
    padding: 20px;
  }
  
  .menu-mobile:after {
    content: "\f0c9";
    font-family: "Font Awesome 5 Pro";
    font-size: 2.5rem;
    padding: 0;
    float: right;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-25%);
    transform: translateY(-25%);
  }
  
  .menu-dropdown-icon:before {
    content: "\f0c9";
    font-family: "Font Awesome 5 Pro";
    display: none;
    cursor: pointer;
    float: right;
    padding: 1.5em 2em;
    background: #fff;
    color: #333;
  }
  
  .menu&gt;ul {
    margin: 0 auto;
    width: 100%;
    list-style: none;
    padding: 0;
    position: relative;
    /* IF .menu position=relative -&gt; ul = container width, ELSE ul = 100% width */
    box-sizing: border-box;
    clear: right;
  }
  
  .menu&gt;ul:before,
  .menu&gt;ul:after {
    content: "";
    display: table;
  }
  
  .menu&gt;ul:after {
    clear: both;
  }
  
  .menu&gt;ul&gt;li {
    float: left;
    background: #e9e9e9;
    padding: 0;
    width: 25%;
    /* added- aidan */
    margin: 0;
    list-style: none!important;
  }
  
  .menu&gt;ul&gt;li a {
    text-decoration: none;
    padding: 1.5em 3em;
    display: block;
  }
  
  .menu&gt;ul&gt;li:hover {
    background: #f0f0f0;
  }
  
  .menu&gt;ul&gt;li&gt;ul {
    display: none;
    width: 100%;
    background: #f0f0f0;
    padding: 20px;
    position: absolute;
    z-index: 99;
    left: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
  }
  
  .menu&gt;ul&gt;li&gt;ul:before,
  .menu&gt;ul&gt;li&gt;ul:after {
    content: "";
    display: table;
  }
  
  .menu&gt;ul&gt;li&gt;ul:after {
    clear: both;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li {
    margin: 0;
    padding-bottom: 0;
    list-style: none;
    width: 25%;
    background: none;
    float: left;
    list-style: none!important;
    /* added - aidan */
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li a {
    color: #777;
    padding: .2em 0;
    width: 95%;
    display: block;
    border-bottom: 1px solid #ccc;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li a:hover {
    color: #03a9f4;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul {
    display: block;
    padding: 0;
    margin: 10px 0 0;
    list-style: none;
    box-sizing: border-box;
    margin-left: 20px;
    text-indent: -10px;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul:before,
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul:after {
    content: "";
    display: table;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul:after {
    clear: both;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul&gt;li {
    float: left;
    width: 100%;
    padding: 0px 0;
    /*reduced to 0px - aidan */
    list-style: none!important;
    /*added -aidan */
    margin: 0!important;
    /*added !important - aidan*/
    font-size: .8em;
  }
  
  .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul&gt;li a {
    border: 0;
    font-size: 14px;
  }
  
  .menu&gt;ul&gt;li&gt;ul.normal-sub {
    width: 300px;
    left: auto;
    padding: 10px 20px;
  }
  
  .menu&gt;ul&gt;li&gt;ul.normal-sub&gt;li {
    width: 100%;
  }
  
  .menu&gt;ul&gt;li&gt;ul.normal-sub&gt;li a {
    border: 0;
    padding: 1em 0;
  }
  
  .head-sub {
    font-weight: 700;
    /* added - aidan */
    color: #be1621!important;
    /* added - aidan */
  }
  
  .mobile-vue {
    display: none!important;
  }
  
  .desktop-vue {
    display: block!important;
    padding: 0px!important;
  }
  
  li.menu-dropdown-icon {
    margin: 0px!important;
  }
  
  .img-desktop-vue {
    max-width: 70%!important;
  }
  
  .tertiary-menu {
    background-color: #e3e3e3;
    /* added - aidan */
  }
  
  
  /* ––––––––––––––––––––––––––––––––––––––––––––––––––
      Mobile style's
      –––––––––––––––––––––––––––––––––––––––––––––––––– */
  
  @media only screen and (max-width: 991px) {
    .mobile-vue {
      display: block!important;
      /*added - aidan*/
    }
    .desktop-vue {
      display: none!important;
      /*added - aidan*/
      padding: unset;
    }
    li.menu-dropdown-icon {
      margin: unset!important;
      /*added - aidan*/
    }
    .menu-container {
      width: 100%;
      display: block;
    }
    .menu-container .menu {
      display: inline-block;
    }
    .menu-mobile {
      display: block;
      float: right;
      padding: 20px 20px 0;
    }
    .menu-dropdown-icon:before {
      display: block;
    }
    .menu&gt;ul {
      display: none;
      width: 100%;
    }
    .menu&gt;ul&gt;li {
      width: 100%;
      float: none;
      display: block;
      margin: 0!important;
      /* added - aidan */
    }
    .menu&gt;ul&gt;li a {
      padding: 1.5em;
      width: 100%;
      display: block;
      color: #000000;
    }
    .menu&gt;ul&gt;li&gt;ul {
      position: relative;
      padding: 0 40px;
    }
    .menu&gt;ul&gt;li&gt;ul.normal-sub {
      width: 100%;
    }
    .menu&gt;ul&gt;li&gt;ul&gt;li {
      float: none;
      width: 100%;
      margin-top: 20px;
      margin: 0!important;
      /* added - aidan*/
    }
    .menu&gt;ul&gt;li&gt;ul&gt;li a {
      width: 90%;
      /* added - aidan */
    }
    .menu&gt;ul&gt;li&gt;ul&gt;li:first-child {
      margin: 0;
    }
    .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul {
      position: relative;
    }
    .menu&gt;ul&gt;li&gt;ul&gt;li&gt;ul&gt;li {
      float: none;
    }
    .menu .show-on-mobile {
      display: block;
    }
    .container-mobil {
      padding-left: unset!important;
      padding-right: unset!important;
    }
  }
  
  .fas,
  .far {
    padding-right: 10px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="menu-container"&gt;
    &lt;div class="menu"&gt;
      &lt;ul class="clearfix"&gt;
        &lt;li&gt;
          &lt;a href="#" class="desktop-vue" style="background-color: #5ac6ca;text-align: center;"&gt; &lt;img src="/static_files/media_manager/1/Index-About-EN-1.png" class="img-desktop-vue"&gt;&lt;/a&gt;
          &lt;a href="#" class="mobile-vue"&gt;ABOUT MPC&lt;/a&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Corporate Info&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/background"&gt;&lt;i class="fas fa-building"&gt;&lt;/i&gt; Background&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/vision-mission-and-objectives"&gt;&lt;i class="fas fa-bullseye"&gt;&lt;/i&gt; Vision, Mission &amp;amp; Objectives&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/board-of-directors"&gt;&lt;i class="fas fa-sitemap"&gt;&lt;/i&gt; Board of Directors&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/management-mpc"&gt;&lt;i class="fas fa-sitemap"&gt;&lt;/i&gt; MPC Management&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/organisational-structure"&gt;&lt;i class="fas fa-sitemap"&gt;&lt;/i&gt; Organisational Structure&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/quality-policy"&gt;&lt;i class="fas fa-file-contract"&gt;&lt;/i&gt; Quality Policy&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/client-charter"&gt;&lt;i class="fas fa-list-alt"&gt;&lt;/i&gt; Client Charter&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/no-gift-policy"&gt;&lt;i class="fas fa-file-contract"&gt;&lt;/i&gt; No Gift Policy&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/anti-corruption-plan"&gt;&lt;i class="fas fa-file-contract"&gt;&lt;/i&gt; Anti-Corruption Plan&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Contact Us&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/contact-us"&gt;&lt;i class="fas fa-address-book"&gt;&lt;/i&gt; How To Contact Us?&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/staff-directory"&gt;&lt;i class="fas fa-users"&gt;&lt;/i&gt; Staff Directory&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/frequently-asked-question"&gt;&lt;i class="fas fa-tasks"&gt;&lt;/i&gt; Frequently Asked Question&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/career"&gt;&lt;i class="fas fa-briefcase"&gt;&lt;/i&gt; Career&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/procurement"&gt;&lt;i class="fas fa-chart-area"&gt;&lt;/i&gt; Procurement&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Staff Access&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="http://staff.mpc.gov.my/"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Staff Portal&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/prince"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Procurement Information Center (PRINCE)&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/fin"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Finance Portal&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
        &lt;li&gt;
          &lt;a href="#" class="desktop-vue" style="background-color: #f7902f;text-align: center;"&gt; &lt;img src="/static_files/media_manager/1/Index-Programme-EN-1.png" class="img-desktop-vue"&gt;&lt;/a&gt;
          &lt;a href="#" class="mobile-vue"&gt;PROGRAMMES &amp;amp; SERVICES&lt;/a&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Productivity Initiatives&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/industry4wrd"&gt;&lt;i class="fas fa-passport"&gt;&lt;/i&gt; Industry4WRD Readiness Assessment&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/team-excellence-convention"&gt;&lt;i class="fas fa-clipboard-check"&gt;&lt;/i&gt; Team Excellence Convention&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/lean-management"&gt;&lt;i class="fas fa-briefcase"&gt;&lt;/i&gt; Lean Management&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/enterprise-business-excellence"&gt;&lt;i class="fas fa-cubes"&gt;&lt;/i&gt; Enterprise Business Excellence&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/productivity-excellence-recognition"&gt;&lt;i class="fas fa-award"&gt;&lt;/i&gt; Productivity Excellence Recognition&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/mpc-certified-productivity-specialist-programme"&gt;&lt;i class="fas fa-user-tie"&gt;&lt;/i&gt; MPC Certified Productivity Specialist Programme&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/productivity-best-practices-case-studies-and-sharing"&gt;&lt;i class="fas fa-poll"&gt;&lt;/i&gt; Productivity Best Practices Case Studies and Sharing&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/productivity-1010"&gt;&lt;i class="fas fa-balance-scale"&gt;&lt;/i&gt; Productivity 1010&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/negeri-produktif"&gt;&lt;i class="fas fa-quote-left"&gt;&lt;/i&gt; Negeri Produktif&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/malaysia-productivity-blueprint"&gt;&lt;i class="fas fa-puzzle-piece"&gt;&lt;/i&gt; Malaysia Productivity Blueprint&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/productivity-nexus"&gt;&lt;i class="fas fa-people-carry"&gt;&lt;/i&gt; Productivity Nexus&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Productivity Online Services&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/digital-regulatory-notification"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Digital Regulatory Notification&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="http://oa.mpc.gov.my/prod/audit.nsf/reg.htm"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; QE Audit Application (Quality Environment)&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="http://bond.mpc.gov.my/"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Benchmarking Online Networking Database (BOND) Portal&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/ezbe"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; ezBE Assessment Tool&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="https://upc.mpc.gov.my/"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Unified Public Consultation (UPC) Portal&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="https://www.wayup.my"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; WayUp Portal&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="http://mymudah.mpc.gov.my/"&gt;&lt;i class="fas fa-globe"&gt;&lt;/i&gt; Smart Regulation (#MyMudah)&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Business Virtual Advisory Services (VAS)&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/business-virtual-advisory-clinic"&gt;&lt;i class="fas fa-business-time"&gt;&lt;/i&gt; Business Virtual Advisory Clinics (VAC)&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;MPC Webinar Sessions With Experts&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="https://www.youtube.com/playlist?list=PLYBMIV_UwzSQuhk5rDPiBG2sLQIYWQ-bv"&gt;&lt;i class="fas fa-chalkboard-teacher"&gt;&lt;/i&gt; MPC Webinar Sessions With Experts&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;P&amp;amp;I Associate Membership&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/associate-membership"&gt;&lt;i class="fas fa-users"&gt;&lt;/i&gt; P&amp;amp;I Associate Membership&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="" class="head-sub"&gt;Events Calendar&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/events-calendar"&gt;&lt;i class="far fa-calendar-alt"&gt;&lt;/i&gt; Events Calendar&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
        &lt;li&gt;
          &lt;a href="#" class="desktop-vue" style="background-color: #4d4f99;text-align: center;"&gt; &lt;img src="/static_files/media_manager/1/Index-Productivity-EN-1.png" class="img-desktop-vue"&gt;&lt;/a&gt;
          &lt;a href="#" class="mobile-vue"&gt;PRODUCTIVITY &amp;amp; COMPETITIVENESS&lt;/a&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Smart Regulation Towards A Robust Ecosystem&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/brvac"&gt;&lt;i class="fas fa-business-time"&gt;&lt;/i&gt; Business Regulation Virtual Advisory Clinic&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/good-regulatory-practice"&gt;&lt;i class="fas fa-landmark"&gt;&lt;/i&gt; Good Regulatory Practice (GRP)&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Workforce Of The Future&lt;/a&gt;
              &lt;ul&gt;
                &lt;li class="menushow"&gt;&lt;a href="/espo"&gt;&lt;i class="fas fa-thumbs-up"&gt;&lt;/i&gt; e-Shared Prosperity Organization (eSPO)&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Digitalisation And Technology&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/digitalisation-and-technology"&gt;&lt;i class="fas fa-chalkboard-teacher"&gt;&lt;/i&gt; Digitalisation And Technology&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Productivity Mindset&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/programme-and-activity"&gt;&lt;i class="fas fa-user-friends"&gt;&lt;/i&gt;  Programme and Activity&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/sejahtera-productivity-culture-index"&gt;&lt;i class="fas fa-users-cog"&gt;&lt;/i&gt; Sejahtera Productivity Culture Index&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Incentive Structure&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/smart-incentives"&gt;&lt;i class="fas fa-gifts"&gt;&lt;/i&gt; Incentive Structure&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
        &lt;li&gt;
          &lt;a href="#" class="desktop-vue" style="background-color: #88c05f;text-align: center;"&gt; &lt;img src="/static_files/media_manager/1/Index-Media-EN-1.png" class="img-desktop-vue"&gt;&lt;/a&gt;
          &lt;a href="#" class="mobile-vue"&gt;MEDIA &amp;amp; PUBLICATION&lt;/a&gt;
          &lt;ul&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Media&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/press-release"&gt;&lt;i class="far fa-newspaper"&gt;&lt;/i&gt; Press Release&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/speeches"&gt;&lt;i class="far fa-comment-alt"&gt;&lt;/i&gt; Speeches&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/audio-gallery"&gt;&lt;i class="fas fa-music"&gt;&lt;/i&gt; Audio Gallery&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/video-gallery"&gt;&lt;i class="fas fa-video"&gt;&lt;/i&gt; Video Gallery&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/enewsletter"&gt;&lt;i class="fas fa-envelope-open-text"&gt;&lt;/i&gt; e-Newsletter&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" class="head-sub"&gt;Publication&lt;/a&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a href="/productivity-performance"&gt;&lt;i class="fas fa-network-wired"&gt;&lt;/i&gt; Productivity Performance&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/competitiveness-report"&gt;&lt;i class="fas fa-chart-bar"&gt;&lt;/i&gt; Competitiveness Report&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="/annual-report"&gt;&lt;i class="fas fa-chart-line"&gt;&lt;/i&gt; Annual Report&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Here is what happen when I scroll when in mobile view: <a href="https://youtu.be/UzLTU-Dzhes" rel="nofollow noreferrer">https://youtu.be/UzLTU-Dzhes</a></p>