HTML Menu Dan Submenu Template Contenpo

 <div class='navbar'>

  <a href='#'>Home</a>

  <a href='#'>Product</a>

  <div class='dropdown'>

  <button class='dropbtn' onclick='myFunction()'>More

    <i class='fa fa-caret-down'/>

  </button>

  <div class='dropdown-content' id='myDropdown'>

    <a href='#'>Submenu 1</a>

    <a href='#'>Submenu 2</a>

    <a href='#'>Submenu 3</a>

    <a href='#'>Submenu 4</a>

    <a href='#'>Submenu 5</a>

  </div>

  </div> 

</div>

<script>

/* When the user clicks on the button, 

toggle between hiding and showing the dropdown content */

function myFunction() {

  document.getElementById(&quot;myDropdown&quot;).classList.toggle(&quot;show&quot;);

}

// Close the dropdown if the user clicks outside of it

window.onclick = function(e) {

  if (!e.target.matches(&#39;.dropbtn&#39;)) {

  var myDropdown = document.getElementById(&quot;myDropdown&quot;);

    if (myDropdown.classList.contains(&#39;show&#39;)) {

      myDropdown.classList.remove(&#39;show&#39;);

    }

  }

}

</script>