JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<div class="main">


  <div class="menu-holder">
  <div class="menu menu-1">
    <div data-menu=".menu-2">
    Download file
    </div>
    <div data-menu=".menu-3">
    Send file
    </div>
  </div>

  <div class="column-2">
  
  
    <div class="menu menu-2">
    <div data-menu=".menu-4">
    Install
    </div>
    </div>

    <div class="menu menu-3">
    <div data-menu=".menu-5">
    Email <input type="text"/>
    </div>
    </div>
  
  </div>

  <div class="column-3">
  

    <div class="menu menu-4">
    <div data-menu=".menu-6">
    Install location <input type="text"/>
    </div>
    </div>

    <div class="menu menu-5">
    <div data-menu=".menu-7">
    Wait for a reply
    </div>
    </div>
  </div>


 <div class="column-4">
  

    <div class="menu menu-6">
    <div data-menu=".menu-8">
    Install extensions
    </div>
    </div>

    <div class="menu menu-7">
    <div data-menu=".menu-9">
    Forward email
    </div>
    </div>
  </div>
  
   <div class="column-5">
  

    <div class="menu menu-8">
    <div data-menu=".menu-10">
    New document
    </div>
    </div>

    <div class="menu menu-9">
    <div data-menu=".menu-11">
    Install
    </div>
    </div>
  </div>
  
     <div class="column-5">
  

    <div class="menu menu-10">
    <div data-menu=".menu-12">
    Save document
    </div>
    </div>

    <div class="menu menu-11">
    <div data-menu=".menu-13">
    Install location <input type="text"/>
    </div>
    </div>
  </div>

</div>

CSS

.menu div:hover {
  background-color: blue;
  color: white;
 
}

.menu-holder {
  display: flex;
  position: absolute;
}

.selected {
  background-color: blue;
  color: white;
}

.menu {
  display: none;
  padding-right: 1em;
}

.main {
  width: 100vw;
  height: 100vh;
}

JavaScript

$(".main").on('contextmenu', function (event) {
  $(".menu").hide();
  $(".menu-1").show();
  $(".menu-holder").css({top: event.pageY, left: event.pageX})
  event.preventDefault();
})
$(".menu div").on('mouseover', function (event) {
  var targetMenu = $(event.target).data('menu');
  $(targetMenu).show();
});